我们可以使用css来定义表格的样式。以下属性用于为
及其元素定义样式:border
CSS的border属性用于定义边框宽度、边框样式和边框颜色。
border-collapse
此属性用于指定
元素是否应具有共享或独立的边框。caption
caption-side属性用于垂直定位表格标题框。
empty-cells
此属性用于指定表格的空单元格的显示方式。
立即学习“前端免费学习笔记(深入)”;
table-layout用于定义浏览器在布局表格的行、列和单元格时使用的算法。
示例
以下示例演示了表格的样式:
实时演示
body { font-family: 'Bookman Old Style', serif;}th { letter-spacing: 1.9px;}#one { border-right: thick solid blue;}td { text-align: center;}Employee List
Employee Department John Marketing Brad Finance Tim IT Steve Operations
Output
This gives the following output −

Example
Live Demo
table { float: left; empty-cells: hide; box-shadow: inset 0 0 4px orange;}tr { box-shadow: inset 0 0 10px greenyellow;}td { font-style: italic; box-shadow: inset 0 0 8px red;}table,td { margin: 6px; padding: 6px; border: 1px solid black;}table| Head 1 | Head 2 | Head 3 |
|---|---|---|
| demo | ||
| demo | ||
| demo |
Output
This gives the following output −

以上就是Styling Tables Working with CSS的详细内容,更多请关注创想鸟其它相关文章!
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1625262.html
微信扫一扫
支付宝扫一扫