小编给大家分享一下css中表布局属性有什么用,希望大家阅读完这篇文章后大所收获、下面让我们一起去探讨吧!
1。定义
表布局属性用来显示表格单元格,行、列的算法规则
2。用法
自动(汽车):(默认值)列宽度由单元格内容设定;
固定:列宽由表格宽度和列宽度设定;
继承:规定应该从父元素继承表布局属性的值。
3。表布局属性说明
该属性指定了完成表布局时所用的布局算法。
<李>固定布局(固定)算法比较快,但灵活性不强。
<李>自动布局(汽车)算法比较慢,却更能反映传统的HTML表。
注:
所有浏览器都支持表布局属性;但任何的版本的Internet Explorer(包括IE8)都不支持属性值“inherit" ! ! !
<强> 1。自动布局(汽车)
在自动布局中,列的宽度是由列单元格中没有折行的最宽的内容设定的,所以设置单元格的宽度是没有效的。
自动布局的算法有时会较慢,这是由于它需要在确定最终的布局之前访问表格中所有的内容。
代码实例:
效果图:
& lt; !DOCTYPE html>
& lt; html>
& lt; head>
& lt;元charset=癠TF-8"祝辞
& lt; title>固定布局& lt;/title>
& lt; style>
表格{交货表布局:固定}
& lt;/style>
& lt;/head>
& lt; body>
& lt;表类=癳x"边境=?”;宽度=?00 px"比;
& lt; tr>
& lt; td宽度=啊霸?000000000000000000000000000000 & lt;/td>
& lt; td宽度=啊霸谖沂遣馐源? lt;/td>
& lt;/tr>
& lt;/table>
& lt;/body>
& lt;/html>
效果图:
<李>
如果指定了td标签(单元格)的宽度,则会按指定的宽度限定每个td标签(单元格)宽度,跟内容无关(如果指定的是比例,会永远保持这个比例),这样就可能出现内容飘到道明标签(单元格)之外的情况。
<李>如果没有指定td标签(单元格)的宽度,则会根据表的总宽度平分到每个td标签(单元格)。
<强>注:
一般情况下如果表表格中的内容是中文,内容过长时文字都会自动换行。但如果表表格中的内容是英文或数字,内容过长时文字就会飘到单元格之外,也就是内容不会自动换行,这时候只要配合css3中的属性<强>自动换行:break-word; 和<强>单词分割:打破所有;一起使用,就可以解决问题了。
看完了这篇文章,相信你对css中表布局属性有什么用有了一定的了解,想了解更多相关知识,欢迎关注行业资讯频道,感谢各位的阅读!
