利用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>
	<tr>
		<td></td>
		<td></td>
	</tr>
	<tr>
		<td></td>
		<td></td>
	</tr>
	<tr>
		<td></td>
		<td></td>
	</tr>
</table>

时间： 2024-08-14 19:53:44

利用CSS边框合并属性打造table细边框的相关文章

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的Clip属性来创造多彩文字

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> &l

利用CSS的@font-face属性在网页中嵌入字体

字体使用是网页设计中不可或缺的一部分.网页是文字的载体,我们希望在网页中使用某一特定字体,但是该字体并非主流操作系统的内置字体,这样用户在浏览页面的时候就有可能看不到真实的设计. 美工设计师最常做的办法是把想要的文字做成图片,这样做有几个明显缺陷: 一.不可能大范围的使用该字体: 二.图片内容相对使用文字不易修改: 三.不利于网站SEO. 网络上有一些使用sIFR技术.或javascript/flash hack的方法,但实现起来或繁琐,或有缺陷.下面要讲的是如何只通过CSS的@font-fac

flex组合流动布局实例---利用css的order属性改变盒子排列顺序

flex弹性盒子 <div class="container"> <div class="box yellow"></div> <div class="container" id="container2"> <div class="box blue"></div> <div class="box green"&

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-

table表格边框的设置

border-collapse 属性设置table的边框是否被合并为一个单一的边框,还是像在标准的 HTML 中那样分开显示. border-collapse值 separate: 默认值.边框会被分开.不会忽略 border-spacing 和 empty-cells 属性. collapse : 如果可能,边框会合并为一个单一的边框.会忽略 border-spacing 和 empty-cells 属性. inherit : 规定应该从父元素继承 border-collapse 属性的

CSS属性 table 的 border-collapse 边框合并

说明该CSS属性用来设定表格的行和列的边框是合并成单边框,还是分别有各自的边框 separate 缺省值.边框分开,不合并.collapse 边框合并.即如果相邻,则共用同一个边框. 虽然在DIV+CSS 时代 table 的权重越来越低,但是有时候,还是局部地方table 还是挺好用的特别是制表方面,还是table 比较的方便.当然,制表肯定少不了边框,但是如果你直接在td上加边框,就会出现一种情况,table 的外围一周是单线,里面都是双线. 你也可以通过其他分开设置的方法实现全部单线,

用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

设置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为{