table 细边框的实现方式

方式1

设置边框的BORDER=0 、cellspacing=1，设置Table的背景色为所要的边框色，再设置所有的td背景色为白色，这样细边框就显露出来了。

方式2

设置BORDER=0 ，再通过CSS，给Table加上1px的border-top,border-left，然后再设置所有的td的border-right,border-bottom，这样也能达到所要的效果。

方式3

设置table的CSS为{border-collapse:collapse;border:none;},再设置td的CSS为{border:solid #000 1px;}

其中，border-collapse有两个属性，separate 和
collapse

1、separate是默认属性，表格边框默认有1px 的间隙

2、collapse，是将表格边框的间隙去掉，这样给表格的td边框赋值时就不会产生双线框了

参考资料： table 细边框 http://www.studyofnet.com/news/857.html

时间： 2024-10-22 14:05:13

table 细边框的实现方式的相关文章

利用CSS边框合并属性打造table细边框

CSS代码: <style> table{ border-collapse: collapse;/* 边框合并属性 */ width:200px; } th{ border: 1px solid #666666; } td{ border: 1px solid #666666; } </style>HTML代码: <table> <tr> <th></th> <th></th> </tr> <

Html table 细边框

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-

1.设置边框的border=0 .cellspacing=1,设置Table的背景色为所要的边框色,再设置所有的td背景色为白色,这样细边框就显露出来了. 2.设置border=0 ,再通过CSS,给Table加上1px的border-top,border-left,然后再设置所有的td的border-right,border-bottom,这样也能达到所要的效果. 3.设置table的CSS为{border-collapse:collapse;border:none;},再设置td的CSS为{

table单元格设置细边框

设置table的CSS为{border-collapse:collapse;border:none;}, 再设置td的CSS为{border:solid #000 1px;}, <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns=&qu

用CSS设置Table的细边框的最好用的方法

今天同事向我问了一个问题,他要设置table的边框,说实话,我也很少弄过table的边框. 通过差一些资料http://blog.sina.com.cn/s/blog_565812e60100czbn.html, 我发现设置table的CSS为{border-collapse:collapse;border:none;},再设置td的CSS为{border:solid#000 1px;}是一个非常不错的方法. 示例: <!DOCTYPE HTML PUBLIC "-//W3C//DTD X

html table 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%;

表格细边框问题

这是关于怎么设置HTML表格细边框的问题,把表格边框设置为细小的线条边框一般我们用表格的时候总会给它个border属性,比如:<table border="1">,其效果如下: ID NAME GENDER 1001 mike male 可以发现表格的边框好像很宽,当然这里的“很宽”绝对不是表格border的宽,大家看到的宽应该是<td>之间有间隙所致.因此只需要修改表格的cellspacing属性即可,即:<table border="1p

设置HTML表格细边框

简介:WEB前端|这是关于怎么设置HTML表格细边框的问题,把表格边框设置为细小的线条边框一般我们用表格的时候总会给它个border属性,比如:<tableborder="1">,其效果如下:IDNAMEG... 这是关于怎么设置HTML表格细边框的问题,把表格边框设置为细小的线条边框一般我们用表格的时候总会给它个border属性,比如:<table border="1">,其效果如下: ID NAME GENDER 1001 mike m

[转]CSS如何设置html table表格边框样式

原文地址:http://www.divcss5.com/wenji/w503.shtml 对table设置css样式边框,分为几种情况: 1.只对table设置边框 2.对td设置边框 3.对table和td技巧性设置表格边框 4.对table和td设置背景,实现完美表格边框以下DIVCSS5对以上几种实现html 表格边框样式进行讲解与案例演示.为了便于观察,divcss5均设置所有案例表格为1px实线红色边框为例:table宽度为400px;表格为三列三行,对以上四种情况表格外层加个div