代码之家 › 专栏 › 技术社区 › jtpereyda

<col class=“slick”>不将类应用于表的列

col html-table css html

jtpereyda · 技术社区 · 16 年前

我对col的理解是,它可以用来表示表列中所有元素的类。但这似乎对我不起作用。我可以把这门课应用到个别的td,但我希望col能帮助我避免这种情况。

<head>
<style type="text/css">
 .slick {
  background-color:#b0c4de; /*This always works*/
  border-style:solid; /*This doesn't work when only applied to a <col>*/
  border-width:5px;
 }
</style>
</head>

有趣的是,背景色总是有效的,但有时边界会失效。

以下是html正文:

<body>
<table><tbody>
 <colgroup>
  <col class="slick" />
  <col class="slick" />
 </colgroup>
 <tr id="r1">
  <td><label >Planner/Scheduler/Estimators</label></td>
  <td class="slick"><label >2010</label></td>
 </tr>
</tbody></table>
</body>

我有预感border不适用于col,但Firebug显示光滑的样式根本不适用于左栏。发生了什么?

3 回复 | 直到 16 年前

Catfish 16 年前

根据w3学校的说法,只有width属性在Firefox中有效。它看起来也完全不支持border属性。

http://www.w3schools.com/tags/tag_col.asp

Sebastian Zartner Emmanouil Chountasis 11 年前

这是因为 CSS 2.1 specification defines 不同的边框属性只在设置 border-collapse: collapse; <table> 元素。

此外,根据CSS 2.1,只有很少的属性可用于设置列的样式(有限制):

边框属性(需要 边界塌陷:塌陷; < 元素)
背景属性(仅当单元格和行背景是透明的时应用)
width
visibility (价值 collapse 避免了单元格的呈现,跨到其他列的单元格被剪裁)

blanchart 8 年前

你不必为每个td申请课程。

 td {
  background-color:#b0c4de;
  border-style:solid;
  border-width:5px;
 }

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

1 年前

Jamie · 在CSS链接的文件名中添加Jinja占位符

1 年前

ptownbro · 重叠分区标签,同时保持以下所有分区和内容就位

1 年前

Luke Frost IEng MIMechE · Bootstrap 5.3在Div中的项目位置没有如我所期望的那样显示

1 年前

Reegan · 使用Angular ngFor指令在html中渲染嵌套对象值

1 年前

wqyutv · 当找不到文件时,任何破坏错误的东西都不会出现,我该怎么解决这个问题?

1 年前

user29519291 · 为不同的变量创建一个带有可重用Click函数的简单菜单

1 年前

Gukkey · 在React中明确隐藏日期类型输入后,如果我单击父div,如何显示日期选择器?

1 年前

Lorenzo Bertolaccini · 在Angular项目中通过对话框后,在控制台中显示但在HTML中不显示的数据数组

1 年前

john Rizzo · 按钮背景颜色、悬停和活动状态存在问题

1 年前