实现表格边框细线化的方法

最新推荐文章于 2023-04-22 17:15:34 发布

原创最新推荐文章于 2023-04-22 17:15:34 发布 · 792 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#html #css #javascript

JS 网页制作专栏收录该内容

4 篇文章

订阅专栏

本文介绍了一种简单的方法来细线化表格边框，并通过HTML代码实现。包括将表的背景设为边框颜色和单元格背景设为白色。还提供了另一种方法，即设置表的外边框宽度为1，内框宽度为0。

方法一：

<html>
<head>
<title>表格边框细线化</title>
</head>
<body>
<table width="500" border="0" align="center" bgcolor="00ff00"> 
<tr>
<td width="100" height="30" bgcolor="#ffffff">产品</td>
<td align="center" bgcolor="#ffffff">价格</td>
<td align="center" bgcolor="#ffffff">点击率</td>
<td align="center" bgcolor="#ffffff">次数</td>
</tr>
</table>
</body>
</html>

实现原理：将表格的背景设成自己喜欢的边框颜色，表格中的单元格背景设成白色。好简单！

方法二：

<html>
<head>
<title>网页学习</title>
</head>
<body>
<table cellspacing="0" width="300" border="1" bordercolor="#00FF00">
  <tr>
    <td>单元格</td>
    <td> </td>
    <td> </td>
  </tr>
</table>
</body>
</html>

实现原理：设置表格的外边框的宽度为1 ，内框的宽度为0即可，更简单！

未完待续。。。。。