html表格制作10*10,HTML基础10--表格的使用

HTML表格

在HTML中构建表格数据可以让web显示数据变得更容易，表格在实际的生活中是极其常见的直观的表达方式

创建一个表格

TABLE

表格1	表格2	表格3	表格4
1	2	3	4

设置CSS表格样式

html {

font-family: sans-serif;

}

table {

border-collapse: collapse;

border: 2px solid rgb(200,200,200);

letter-spacing: 1px;

font-size: 0.8rem;

}

td, th {

border: 1px solid rgb(190,190,190);

padding: 10px 20px;

}

th {

background-color: rgb(235,235,235);

}

td {

text-align: center;

}

tr:nth-child(even) td {

background-color: rgb(250,250,250);

}

tr:nth-child(odd) td {

background-color: rgb(245,245,245);

}

caption {

padding: 10px;

}

打开浏览器

单元格跨越多行和列

需要用到colspan和rowspan两个属性

公众号：伊洛的小屋

个人主页：https://yiluotalk.com/

博客园：https://www.cnblogs.com/yiluotalk/

表格TITLE

城市表格

北京
上海
广东	广州
	深圳
天津
辽宁	沈阳
	大连

打开浏览器

共同的样式

HTML有一种方法可以定义整列数据的样式信息

,

为表格增加标题

通过

元素表格TITLE

城市表格

中国城市

北京
上海
广东	广州
	深圳
天津
辽宁	沈阳
	大连

标题放在