您的位置：首页 > Web前端 > HTML

html table td 边框效果

2013-10-10 13:58 411 查看


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>

 <body>

  <div style="width:100%;height:100%;">

   <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>

效果如下：

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航