省心的表格工具Tablepress

插件

我们直接从excel粘贴到编辑器也可以做出表格。有时候会需要调整下样式,自适应往往也会遇到问题。视频中自适应修改代码如下,在text block中添加类,比如newtable

.newtable
{
overflow-x:auto;
}

所以,对于参数比较复杂的行业,优秀的表格工具很有必要。Tablepress做的不错,而且作者的收费方式很好,所有的工具,包括premium高级扩展也全部免费,仅仅希望一些商用的网站在使用tablepress之后可以捐赠。作者是德国小哥 Tobias Bäthge。

官网 https://tablepress.org

自适应扩展:https://tablepress.org/extensions/responsive-tables/

响应的四种方法

响应表扩展提供了四种方法来解决此问题:

  • flip:在此模式下,固定左侧第一列,使其水平滚动来更改表的布局。对于纯数据/文本表,此模式是一个很好的解决方案。(推荐)
  • scroll:此模式只会使表格完全显示水平滚动。
  • collapse:该方法可以向表添加隐藏/扩展效果。它将从那些本来会被截断的列中隐藏数据,而是将数据添加到插入每个条目下方的可折叠行中。可以使用“ +”和“-”按钮显示和隐藏该行。
  • stack:此模式将一行的单元格显示为彼此顶部,而不是彼此相邻。这将使表更加狭窄,因为它似乎只有一列。

多设备的写法

[table id=123 responsive=flip responsive_breakpoint="phone" /]
  • phone: 用于手机,低于 768 像素
  • tablet: 低于980像素,一般是手机和平板
  • desktop: 宽度低于1200像素
  • all: 不论尺寸
上一课
Contact Form 7
下一课
超级牛x编辑器,Nicepages
Contact Form 7
超级牛x编辑器,Nicepages