table表格中cellspacing和cellpadding属性失效(不起作用)的原因和解决方案

table表格中cellspacing和cellpadding属性失效(不起作用)的原因和解决方案

这两天老板说他后台编辑内容编不好,让我改一下

从这样

改成这样

照这个样子,用table编辑是最合适了。

我在后台用table的cellspacing和cellpadding设置了边距,后台看着是好了,前台看还是没有间距,两张图片是贴在一起的。

为什么呢?查了资料,说html5不支持table的这些属性了。也不知道是不是因为这个。

因为bootstrap样式文件里面,默认写了table的属性是:

table {

border-spacing: 0;

border-collapse: collapse;

}

td,

th {

padding: 0;

}

很显然这些设置也同样使得那两个属性失效了。

我试着把这些设置改回去,border-collapse: separate; padding改成inherit;也一样没有作用~

没办法,只能用放大招,写css样式来控制了!!!

.page-content table{ border-collapse:separate; border-spacing:inherit;}

.page-content table td{ padding:10px;}

第一行有没有作用我不知道,反正第二行是起作用了

效果如图:

反正是好了哈哈,搞来搞去的,还是直接写样式最快啊。

很简单很基础的东西,还是简单记录一下吧。也许,刚好你也遇到这个问题呢^_^

相关文章

30个小习惯,带你变美变漂亮,这次一定要坚持!
皇马世界杯冠军球员:荣耀与传承的交织
bt365软件下载

皇马世界杯冠军球员:荣耀与传承的交织

09-03 阅读: 6322
孝利家民宿 第二季
365bet365网址

孝利家民宿 第二季

10-30 阅读: 4967
「南派三叔」十年骂战内幕:误解与真相交织的文学之路
最勤劳的是什么生肖 最勤劳打一生肖
bt365软件下载

最勤劳的是什么生肖 最勤劳打一生肖

09-29 阅读: 9736
STM32中断标志:先清理后清理的区别
365体育投注网

STM32中断标志:先清理后清理的区别

09-12 阅读: 9896