当前位置：首页 -> 网页设计 -> FRONTPAGE -> 网页实现细线边框精彩技巧二则

网页实现细线边框精彩技巧二则

时间： 2021-07-31 作者：daque

很多伙伴都有过创造网页的体验。此刻，稠密网页安排都用到了表格。如许不只利于于网页保护，同声普及了网页的参观性。在稠密网页创造作风中，细边框这个创造本领是必不行少的。这边，我将大略地谈一下细边框的创造本领。

提出细边框，自己觉得大概有两种创造本领：第一种是用表格的嵌套，第二种是用css强迫设置。

第一本领：用表格嵌套。

怎样用表格嵌套呢？大师都领会，用bgcolor不妨在表格中大肆设置表格的后台脸色。用cellspacing不妨遏制表格单位的特殊空间。即使设置两个表格，把个中一个的表格后台设为全黑，而后在这个表格中嵌套设置其余一个表格，后台设为全白，而且把weight=100%。这时候，两个表格是臃肿的，然而，即使把后台为玄色的谁人表格再设置一个cellspacing=1。那么即是说，玄色的表格比白色的表格多出了一个像素的外层空间，而白色的表格又在玄色表格之上，进而到达细边框的功效。

源代码如次：

〈table border="0" cellpadding=0 cellspacing=1 bgcolor=black〉　　〈tr〉　　〈td〉　　〈table width="100%" border="0" cellpadding=0 cellspacing=0 bgcolor=white〉　　〈tr〉　　〈td〉　　〈/td〉　　〈/tr〉　　〈/table〉　　〈/td〉　　〈/tr〉　　〈/table〉

第二种本领：用css强迫设置。

这种本领比拟大略，那即是用css（层叠款式表）强迫设置。然而，有些比拟老的欣赏器不扶助css，大概引导没辙表露你所诉求的功效。然而运用css设置，语句特殊简略，所作网页的含量也较小。

它的操纵本领是：在表格的最外层的相映最小单位的〈td〉标签中设置style="border-postion: black 1px solid;"，个中，postion的参数有left、right、top和bottom，辨别表白在单位的左、右、上、下表露一条1个像素宽的实线条。

源代码如次：

〈table border="0" bgcolor=white〉　　〈tr〉　　〈td style="border-left: black 1px solid; border-top: black 1px solid;"〉　　〈/td〉　　〈td style="border-top: black 1px solid; border-right: black 1px solid;"〉　　〈/td〉　　〈/tr〉　　〈tr〉　　〈td style="border-left: black 1px solid; border-bottom: black 1px solid;"〉　　〈/td〉　　〈td style="border-bottom: black 1px solid; border-right: black 1px solid;"〉　　〈/td〉　　〈/tr〉　　〈/table〉

网页实现细线边框精彩技巧二则

相关推荐

推荐下载

热门阅览

最新排行