A+

在文章中添加自适应表格

2019年03月13日 网络资讯 抢沙发 212次浏览

写这篇文章完全是记录用的,看了知更鸟主题的主题说明,感觉这个表格以后应该可以用得到,所以算是记录下来吧,其实想要记录的东西还有很多,但知更鸟官方的这些内容都是加密的,只有正版的用户是有密码的;感觉这篇文章的内容其实也没有什么太大的技术含量,所以就转发过来了,但如果转载有什么地方不合适我一定会删除这篇文章!

自适应表格代码

  1. <h3>自适应表格</h3>
  2. <div class="table-r">
  3. <table width="100%">
  4. <tbody>
  5. <tr>
  6. <td width="50%">自适应表格</td>
  7. <td width="50%">输入文字</td>
  8. </tr>
  9. <tr>
  10. <td width="50%">自适应表格</td>
  11. <td width="50%">输入文字</td>
  12. </tr>
  13. <tr>
  14. <td width="50%">自适应表格</td>
  15. <td width="50%">输入文字</td>
  16. </tr>
  17. <tr>
  18. <td width="50%">自适应表格</td>
  19. <td width="50%">输入文字</td>
  20. </tr>
  21. </tbody>
  22. </table>
  23. </div>

想添加更多行,多复制几个:

  1. <tr>
  2.     <td width="50%">自适应表格</td>
  3.     <td width="50%">输入文字</td>
  4. </tr>

如果想让文字居中,可以在WP编辑器中选择中,也可将下面的样式代码添加到主题选项→定制风格“自定义样式”中:

  1. .table-r td{
  2.     text-aligncenter;
  3. }

 

自适应表格样式

自适应表格输入文字
自适应表格输入文字
自适应表格输入文字
自适应表格输入文字

 

  • 本文为原创文章,版权归所有。欢迎分享本文,转载请保留出处!
  • 给我留言