不用插件css+html代码实现在WordPress中插入表格的效果

楚狂人

发表文章数:743

云服务器102元

新用户专享福利

个人上云

1核 2G 1M

突发性能型T5

带宽1-5M可选

适合入门级用户

¥102/年
首页 » wordpress » 正文

楚狂人博客(chukuangren.com)见过几个建站博客都用表格方式放文字广告,自己也试过多种方法在WordPress文章里面插入表格,有代码也有插件的方式,各有利弊。wordpress作为博客系统来说,插入表格还是比较少用的。但也有朋友会有这个需求,今天看到苏醒博客的一个css+html代码实现在WordPress中插入表格的效果还不错,转载过来,有时间了可以再把博客折腾一下。

第一步:把表框css插入到你的主题的style.css中。

.table{width:100%;border-top:1px solid #d8d8d8;border-left:1px solid #d8d8d8;margin-bottom:20px}
.table th{text-align:center;background-color:#f6f5f2;font-weight:normal}
.table td,.table th{text-align:center;padding:10px 15px;font-size:14px;border-right:1px solid #d8d8d8;border-bottom:1px solid #d8d8d8}

第二步,你可以使用word文档,把你需要的表格编辑好,

不用插件css+html代码实现在WordPress中插入表格的效果

第三步:直接复制粘贴到你的文章里面去。

注意要在可视化模式下添加

不用插件css+html代码实现在WordPress中插入表格的效果

第四步:给表格添加css样式标签

切换到文本模式,给table添加一个样式class="table"

不用插件css+html代码实现在WordPress中插入表格的效果

最终效果

当然,你也可以根据自己的需要,对css进行一定的美化,让表格的样式更丰富,更美观。

不用插件css+html代码实现在WordPress中插入表格的效果

这个表格有什么用呢?嘿嘿,其实作为一个it博客,我们可以放光告的撒~~~~

转载请注明:作者:楚狂人, 转载或复制请以 超链接形式 并注明出处 楚狂人博客
原文地址:《不用插件css+html代码实现在WordPress中插入表格的效果》 发布于2017-09-27

分享到:
赞(7) 打赏 生成海报

长按图片转发给朋友

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏

每天拆双十一超级红包
双十一超级红包 1111
切换登录

注册