给WordPress添加自适应表格 让表格自适应屏幕

wordpress自带的表格不能自适应屏幕宽带，每次新建了表格，电脑上显示正常的，结果换到手机上就超出屏幕宽度了，很麻烦，更重要的是很不美观，本次我就问为大家带来一个添加自适应表格的教程。

案列分析

我们可以看到代码中关于定义table(表格)属性的代码是（重点）：

 style="table-layout: fixed;" border="1" width="100%" cellspacing="0" cellpadding="2">

上述代码解析：border—表格的线宽为1；cellspacing—表格内数据与表格间隔为0；cellpadding—单元格与单元格间隔为2，这样就可以实现表格自适应了，但是有个问题里面的文字会自动换行，导致高度发生变化，也不是很好看。所以我还带来了一种方法

自适应表格代码：

还有一种办法就是给文字也加上自适应，不过上面的代码就不适用了，如果要实现文字和表格都自适应可以用下面的代码：

系统自适应表格
 class="table-r">
 width="100%">
    
        
             width="50%">自适应表格
             width="50%">输入文字
        
        
             width="50%">自适应表格
             width="50%">输入文字
        
        
             width="50%">自适应表格
             width="50%">输入文字
        
        
             width="50%">自适应表格
             width="50%">输入文字
        
    

1
2
3
.table-r td{
    text-align: center;
}