建设银行天津分行门户网站,app官网模板,wordpress女生主题,高端装修公司名字大全1 表格基本语法 tr#xff1a;table row
th#xff1a;table head
2 表格属性
2.1 基本属性
表格的基本属性是指表格的行、列和单元格但并不是每个表格的单元格大小都是统一的#xff0c;所以需要设计者通过一些属性参数来修改表格的样子#xff0c;让它们可以更更多样…1 表格基本语法 trtable row
thtable head
2 表格属性
2.1 基本属性
表格的基本属性是指表格的行、列和单元格但并不是每个表格的单元格大小都是统一的所以需要设计者通过一些属性参数来修改表格的样子让它们可以更更多样化。这些属性参数包括行高、宽度等。 1行高height属性2宽度width属性3. 边框Border属性4单元格大小属性height和width
!DOCTYPE html
html
body
table border1 height100% width100%trth height50 width100 Head 1 /thth Head 2 /th/trtrtd row, cell 1 /tdtd row, cell 2 /td/tr
/table
/body
/html
百分比表示所占浏览器的大小
绝对数字表示像素值大小 2.2 其他属性
bgcolor: 定义表格或者单元格的背景颜色background: 定义表格或者单元格的背景图片
!DOCTYPE html
html
body
table border1 height100% width100% bgcolorlightgreentrth height50 width100 bgcolorlightblue Head 1 /thth Head 2 /th/trtrtd bgcolorred row, cell 1 /tdtd row, cell 2 /td/tr
/table
/body
/html 3 合并单元格
合并同一行的单元格时要用到 colspan 属性合并同一排的单元格时要用到 rowspan 属性
!DOCTYPE html
html
body
/table
table border3 trtd colspan212/tdtd3/tdtd rowspan3 4br/8br/12/td/trtrtd5/tdtd6/tdtd7/td/trtrtd9/tdtd10/tdtd11/td/trtrtd13/tdtd14/tdtd15/tdtd16/td/tr
/table/body
/html 4 表格标题
caption标签是用来给表格添加标题的。默认情况下将位于表格上方居中的位置且会根据表格的宽度自行调整位置。
!DOCTYPE html
html
body
table border1 height100% width100%caption表格题目/captiontrth height50 width100 Head 1 /thth Head 2 /th/trtrtd row, cell 1 /tdtd row, cell 2 /td/tr
/table
/body
/html 5 使用CSS 来定义表格属性
利用CSS来定义表格单元格的height和width利用CSS来定义表格单元格的border属性 可以按顺序设置如下属性 border-widthborder-style: dotted (点状) solid 实线 double 双线 dashed 虚线;border-color
!DOCTYPE html
html
headstyletable {height: 300px; border: 2px solid lightblue;}table th {height: 32px; width: 100px;border: 10px dashed red;}table td {border: 5px double green;}/style/headbody
tabletrth Head 1 /thth Head 2 /th/trtrtd row, cell 1 /tdtd row, cell 2 /td/tr
/table
/body
/html table是最外圈
table th是head部分内圈
table td是 表格正文部分内圈
