CSS 表格

html-css010

CSS 表格,第1张

指定CSS表格边框,使用border属性。

下面的例子指定了一个表格的Th和TD元素的黑色边框

例子: table,th,td{border:1px solid black}

请注意,在上面的例子中的表格有双边框。这是因为表和th/ td元素有独立的边界。

为了显示一个表的单个边框,使用 border-collapse属性。

border-collapse 属性设置表格的边框是否被折叠成一个单一的边框或隔开:

例子: table{border-collapse:collapse}

           table,th, td{border: 1px solid black}

Width和height属性定义表格的宽度和高度。

下面的例子是设置100%的宽度,50像素的th元素的高度的表格:

例子:table,td,th{border:1pxsolidblack}

           table{width:100%}

           th{height:50px}

表格中的文本对齐和垂直对齐属性。

text-align属性设置水平对齐方式,向左,右,或中心:

如需控制边框和表格内容之间的间距,应使用td和th元素的填充属性:

例子: td{padding:15px}

下面的例子指定边框的颜色,和th元素的文本和背景颜色:

在CSS中可以使用border-collapse属性来合并表格边框;border-collapse属性用于设置表中存在的单元格的边框,并告知这些单元格是否共享公共边框。

border-collapse属性设置表格的边框是否被合并为一个单一的边框。

语法:

属性值:

● separate:用于设置单元格的单独边框。

● collapse:用于折叠相邻的细胞并形成共同的边界。

● initial:用于将border-collapse属性设置为其默认值。

● inherit:当border-collapse属性从其父元素继承时使用。

示例:

效果图:

浏览器支持

border-collapse属性支持的浏览器如下:

● Apple Safari 1.2

● 谷歌Chrome 1.0

● Internet Explore / Edge 5.0

● Opera 4.0

● Firefox 1.0

原文地址: 如何使用CSS合并表格边框?

CSS 字体属性(Font)

属性 描述 CSS

font 在一个声明中设置所有字体属性。 1

font-family 规定文本的字体系列。 1

font-size 规定文本的字体尺寸。 1

font-size-adjust 为元素规定 aspect 值。 2

font-stretch 收缩或拉伸当前的字体系列。 2

font-style 规定文本的字体样式。 1

font-variant 规定是否以小型大写字母的字体显示文本。 1

font-weight 规定字体的粗细。 1