html table td 边框效果

最新推荐文章于 2022-08-17 16:06:04 发布

SunShinetou

最新推荐文章于 2022-08-17 16:06:04 发布

阅读量2.2k

点赞数

分类专栏： JSP

JSP 专栏收录该内容

4 篇文章

订阅专栏

本文详细介绍了HTML表格中如何设置边框样式，包括边框颜色、宽度、风格等，通过实例展示不同边框效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

html table td边框效果

2012-06-13 15:46:44| 分类： java笔记 | 标签：td效果 |字号订阅

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
<head>
<title>table边框测试</title>
</head>

   <table border="1" bordercolor="#FF9966" >
    <tr>
    <td width="102" style="border-right-style:none">隐藏右边框</td>
    <td width="119" style="border-left-style:none">隐藏左边框</td>
    </tr>
    <tr>
    <td style="border-top-style:none">隐藏上边框</td>
    <td style="border-bottom-style:none">隐藏下边框</td>
    </tr>
   </table>

   <table>
    <tr>
    <td style="border-right:#cccccc solid 1px;">显示右边框</td>
    <td style="border-left:#cccccc solid 1px;">显示左边框</td>
    <td style="border-top:#cccccc solid 1px;">显示上边框</td>
    <td style="border-bottom:#cccccc solid 1px;">显示下边框</td>
    </tr>
   </table>

   <table>
    <tr>
    <td style="border-right : thin dashed blue;">右边框显示细虚线</td>
    <td style="border-bottom: thick dashed yellow;">下边框显示粗虚线</td>
    <td style="border-top: double green;">上边框显示两条线</td>
    <td style="border-left: dotted red;">左边框显示点</td>
    </tr>
   </table>

</div>

</body>
</html>

效果如下：