CSS 为什么TR不走风格?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/2597694/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 21:52:44  来源:igfitidea点击:

Why TR not taking style?

cssxhtml

提问by Jitendra Vyas

CSS

CSS

table tr {border-bottom:1px solid #008999}

HTML

HTML

<table width="100%" cellspacing="0" cellpadding="0">
   <thead>
      <tr>
         <th scope="col">one</th>
         <th scope="col">two</th>
         <th scope="col">three</th>
      </tr>
   </thead>
   <tbody>
      <tr>
         <th scope="row">Hello</th>
         <td>&nbsp;</td>
         <td>&nbsp;</td>
      </tr>
   </tbody>
</table>

回答by fuxia

Add:

添加:

table
{
    border-collapse: collapse;
}

Otherwise trcreates no single block.

否则不tr创建单个块

Simple example:

简单的例子:

table
{
  border: 5px solid #900;
  background: #fff;
}
tr
{
  border: 5px solid #090;
}
td
{
  background: #ccc;
  padding: 5px 0;
}

table + table
{
  border-collapse: collapse;
}
<table>
  <tr>
    <td>def</td>
    <td>ault</td>
  </tr>
</table>
<table>
  <tr>
    <td>coll</td>
    <td>apse</td>
  </tr>
</table>

回答by rahul

Try giving

尝试给予

table tr th {border-bottom:1px solid #008999}

Then you can use

然后你可以使用

table { border-collapse: collapse; }
table tr {border-bottom:1px solid #008999; }

See The collapsing border model

请参阅折叠边框模型

回答by sandyiit

tr by definition wont take border styles. You need to apply it to the td's within it:

tr 根据定义不会采用边框样式。您需要将其应用于其中的 td:

table tr td {border-bottom:1px solid #008999}