css表格设置边框
篇一:网站制作表格边框css样式
有关表格边框的css语法
具体内容包括:上边框宽度、右边框宽度、下边框宽度、左边框宽度、边框宽度、边框颜色、边框样式、上边框、下边框、左边框、右边框、边框、宽度、高度、有关标签等。
1.上边框宽度
语法: border-top-width: <值
允许值: thin | medium | thick | <长度
初始值: medium
2.右边框宽度
语法: border-right-width: <值
允许值: thin | medium | thick | <长度
3.下边框宽度
语法: border-bottom-width: <值
允许值: thin | medium | thick | <长度>(来自:WWw.xlTkwj.com 小龙文 档网:css表格设置边框);
初始值: medium
4.左边框宽度
1
语法: border-left-width: <值
允许值: thin | medium | thick | <长度
5.边框宽度
语法: border-width: <值
允许值: [ thin | medium | thick | <长度 ]{1,4}
6.边框颜色
语法: border-color: <值
允许值: <颜色{1,4}
边框颜色属性设置一个元素的边框颜色。可以使用一到四个关键字。如果四个值都给出了,它们分别应用于上、右、下和左边框的式样。如果给出一个值,它将被运用到各边上。如果两个或三个值给出了,省略了的值与对边相等。也可以使用略写的边框属性。
7.边框样式
语法: border-style: <值
允许值: [ none | dotted | dashed | solid | double | groove |
ridge | inset | outset ]{1,4}
初始值: none
none:无样式;
dotted:点线;
dashed:虚线;
solid:实线;
2
double:双线;
groove:槽线;
ridge:脊线;
inset:内凹;
outset:外凸。
8.上边框
语法: border-top: <值
允许值: <上边框宽度 || <边框式样 || <颜色
9.右边框
语法: border-right: <值
允许值: <右边框宽度 || <边框式样 || <颜色
10.下边框
语法: border-bottom: <值
允许值: <下边框宽度 || <边框式样 || <颜色
11.左边框
语法: border-left: <值
允许值: <左边框宽度 || <边框式样 || <颜色
12.边框
语法: border: <值
边框声明的例子包括:
H2 { border: groove 3em }
A:link { border: solid blue }
3
A:visited { border: thin dotted #800080 }
A:active { border: thick double red }
边框属性只能设置四种边框;只能给出一组边框的宽度和式样。为了给出一个元素的四种边框的不同的值,网页制作者必须用一个或更多的属性,如:上边框、右边框、下边框、左边框、边框颜色、边框宽度、边框式样、上边框宽度、右边框宽度、下边框宽度或左边框宽度。
13.宽度
语法: width: <值
允许值: <长度 | <百分比 | auto
14.高度
语法: height: <值
允许值: <长度 | auto
初始值: auto
适用于: 块级和替换元素
15.有关标签
table:表格标签,对整个表格样式的定义要放在table中;
td:单元格标签,对单元格样式的定义要放在td中。
篇二:20Css如何表格边框
Css 如何表格边框如需在 CSS 中设置表格边框,请使用 border 属性。请注意,上例中的表格具有双线条边框。这是由于 table、th 以及 td 元素都有独立的边框。 如果需
4
要把表格显示为单线条边框,请使用 border-collapse 属性。
下面的例子为 table、th 以及 td 设置了蓝色边框:table, th, td { border: 1px solid blue; }折叠边框border-collapse 属性
设置是否将表格边框折叠为单一边框:table,th, td { border: 1px solid black; } table { border-collapse:collapse; }亲自试
一试表格宽度和高度通过 width 和 height 属性定义表格
的宽度和高度。 下面的例子将表格宽度设置为 100%,同
时将 th 元素的高度设置为 50px:
table { width:100%; }th { height:50px; }表格文本对齐请注
意,上例中的表格具有双线条边框。这是由于 table、th 以
及 td 元素都有独立的边框。 如果需要把表格显示为单线
条边框,请使用 border-collapse 属性。td { text-align:right; }亲自试一试 vertical-align 属性设置垂直对齐方式,比如顶
部对齐、底部对齐或居中对齐:td { height:50px; vertical-align:bottom; }表格颜色下面的例子设置边框的颜
色,以及 th 元素的文本和背景颜色:table, td, th
{ border:1px solid green; }th { background-color:green;
color:white; }CSS Table 属性属性 描述 设置是否把表格边
框合并为单一的边框。border-collapseborder-spacing
篇三:CSS 设置边框属性
CSS 设置边框属性
页面元素的边框就是将元素内容及间隙包含在其中的边
5
线,类似于表格的外边线。每一个页面元素的边框可以从三个方面来描述:宽度、样式和颜色,这三个方面决定了边框所显示出来的外观。CSS中分别使用border-style、border-width和border-color这三个属性设定边框的三个方面。
1、border-style属性
border-style属性用于设定边框的样式,也就是风格。设定边框格式是边框最重要的部分,它主要用于为页面元素添加边框。CSS设定了9种边框样式,如表4-5所示。
表4-5 边框样式
在没有设定边框颜色的情况下,groove
、ridge、inset和outset边框默认的颜色是灰色。dotted、dashed、solid和double这四种边框的颜色基于页面元素的color值。 其实,这几种边框样式还可以分别定义在一个边框中,从上边框开始按照顺时针的方向分别定义边框的上、右、下、左边框样式,从而形成多样式边框。
另外,如果需要单独的定义边框的一条边的样式,则可以使用如表4-6所列的属性来定义。
表4-6 各边样式属性
2在设定了边框的样式之后,就要根据需要来设定边框的宽度。border-width属性
6
7
本文档为【css表格设置边框】,请使用软件OFFICE或WPS软件打开。作品中的文字与图均可以修改和编辑,
图片更改请在作品中右键图片并更换,文字修改请直接点击文字进行修改,也可以新增和删除文档中的内容。
该文档来自用户分享,如有侵权行为请发邮件ishare@vip.sina.com联系网站客服,我们会及时删除。
[版权声明] 本站所有资料为用户分享产生,若发现您的权利被侵害,请联系客服邮件isharekefu@iask.cn,我们尽快处理。
本作品所展示的图片、画像、字体、音乐的版权可能需版权方额外授权,请谨慎使用。
网站提供的党政主题相关内容(国旗、国徽、党徽..)目的在于配合国家政策宣传,仅限个人学习分享使用,禁止用于任何广告和商用目的。