2)width标签属性:设定表格的宽度;不建议通过width标签属性设置表格宽度,建议向table标签添加width样式属性进行设置。
- px :设置以像素计的宽度(例:width=“100px”)
- %:设置以包含元素的百分比计的宽度(例:width=“100%”)
例:
姓名 | 年龄 | 性别 |
---|---|---|
张三 | 19 | 男 |
3)align标签属性:指定表格相对于周围标签的对齐方式,建议向table标签添加样式属性进行设置;
属性值:
- left:左对齐表格
- right:右对齐表格
- center:居中对齐表格
(1)通过float样式属性实现左右对齐;
- left:元素向左浮动
- right:元素向右浮动
- none:默认值,元素不浮动
- inherit:规定应该从父元素继承float属性的值
(2)通过margin样式属性实现居中对齐;
- margin:0 auto;
例:
姓名 | 年龄 | 性别 |
---|---|---|
张三 | 19 | 男 |
4)cellspacing 标签属性:设定单元格之间的间距(单位:px),建议向table标签添加border-spacing样式属性进行设置;
例:
姓名 | 年龄 | 性别 |
---|---|---|
张三 | 19 | 男 |
5)cellpadding标签属性:设定单元边沿与单元内容之间的间距(单位:px),建议向td或th标签添加padding样式属性来实现;
例:
姓名 | 年龄 | 性别 |
---|---|---|
张三 | 19 | 男 |
6)bgcolor标签属性:设置表格背景颜色;
- color_name:规定颜色值为颜色名称的背景颜色
- hex_number:规定颜色值为十六进制的背景颜色
- rgb_number:规定颜色值为rgb代码的背景颜色
姓名 | 年龄 | 性别 |
---|---|---|
张三 | 19 | 男 |
7)border-collapse样式属性:设置表格的边框是否被合并为一个单一的边框;
- separate:默认值,边框会被分开;
- collapse:边框会合并为一个单一的边框;
- inherit:规定应该从父元素继承border-collapse属性的值;
例:
姓名 | 年龄 | 性别 |
---|---|---|
张三 | 19 | 男 |
用标签属性完成一个表格:
1 | 1 | 1 |
1 | 1 | 1 |
1 | 1 | 1 |
标签属性:
1)align标签属性:设置表格行中单元格内容的水平对齐方式;
- left:左对齐内容(默认值)
- right:右对齐内容
- center:居中对齐内容(th元素的默认值)
- justify:对行进行伸展,这样每行都可以有相等的长度
- char:将内容对准指定字符
2)valign标签属性:设置表格行中单元格内容的垂直对齐方式;
- top:对内容进行上对齐
- middle:对内容进行居中对齐(默认值)
- bottom:对内容进行下对齐
- baseline:与基线对齐
3)bgcolor标签属性:设定表格行的背景颜色
- color_name:规定颜色值为颜色名称的背景颜色
- hex_number:规定颜色值为十六进制的背景颜色
- rgb_number:规定颜色值为rgb代码的背景颜色
例:
table{
border: 1px solid black;
width: 20%;
/float:right;/
margin: 0 auto;
border-spacing:0 ;
background-color: red;
border-collapse: collapse;
}
tr{
height: 50px;
text-align: center;
vertical-align: top;
后话
对于面试,说几句个人观点。
面试,说到底是一种考试。正如我们一直批判应试教育脱离教育的本质,为了面试学习技术也脱离了技术的初心。但考试对于人才选拔的有效性是毋庸置疑的,几千年来一直如此。除非你有实力向公司证明你足够优秀,否则,还是得乖乖准备面试。这也并不妨碍你在通过面试之后按自己的方式学习。
其实在面试准备阶段,个人的收获是很大的,我也认为这是一种不错的学习方式。首先,面试问题大部分基础而且深入,这些是平时工作的基础。就好像我们之前一直不明白学习语文的意义,但它的意义就在每天的谈话间。
所谓面试造火箭,工作拧螺丝。面试往往有更高的要求,也迫使我们更专心更深入地去学习一些知识,也何尝不是一种好事。