使用border-collapse实现表格单线边框

最新推荐文章于 2021-02-01 01:07:09 发布

原创最新推荐文章于 2021-02-01 01:07:09 发布 · 235 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#HTML

CSS+DIV 专栏收录该内容

6 篇文章

订阅专栏

本文介绍了一种利用CSS属性border-collapse来简化HTML表格边框显示的方法，通过设置此属性为collapse，可以使表格边框呈现为单一线条，避免多重边框带来的视觉冗余。

HTML代码

<h1>使用border-collapse实现表格单线边框</h1>
<h3><a href="http://www.865171.cn"
 style="color:#000;">www.865171.cn</a></h3>
<table width="300" border="1" cellpadding="0"
 cellspacing="0" bordercolor="#FF0000"
  style="border-collapse:collapse;">
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>