Web前端开发技术项目教程课件 3.1.4知识点2表格宽度和高度.pptx

表格宽度和高度信息安全技术应用ApplicationofInformationSecurityTechnology《前端技术开发》

前端技术开发知识储备表格的宽度和高度1table中设置宽度和高度2tr中设置高度3td中设置宽度和高度4

表格的宽度和高度前端技术开发01表格中可以设置宽度width属性和高度height属性，可设置在如下标记中：table标记中设置表格的宽度和高度td标记设置单元格的宽度和高度tr标记中设置行高度

表格的宽度和高度前端技术开发02表示宽度和高度的值一般有两种表示方法：第一种用数值表示，单位为px，如600第二种用百分比表示，相对于设置该属性所在元素的父元素的宽度和高度，如60%tableborder=1width=300height=90pxtrtdnbsp;/tdtdnbsp;/tdtdnbsp;/td/trtrtdnbsp;/tdtdnbsp;/tdtdnbsp;/td/tr/tabletableborder=1width=40%trheight=30tdnbsp;/tdtdnbsp;/tdtdnbsp;/td/tr/table

table中设置宽度和高度前端技术开发02width：在table中用来设置宽度的最大值，不能改变即使字数超过也不能改变但如果插入图片则会根据图片大小改变宽度height：与width相反，设置高度最小值，而且会根据字数多少而自动延伸，当内容没有达到此高度值会自动扩充。tableborder=1width=300height=100trth排名/thth品牌/thth车型/th/trtrtd1/tdtd比亚迪/tdtd秦PLUS/td/tr/table

table中设置宽度和高度前端技术开发02width：在table中用来设置宽度的最大值，不能改变即使字数超过也不能改变但如果插入图片则会根据图片大小改变宽度height：与width相反，设置高度最小值，而且会根据字数多少而自动延伸，当内容没有达到此高度值会自动扩充。tableborder=1width=100%height=150trth排名/thth品牌/thth车型/th/trtrtd1/tdtd比亚迪/tdtd秦PLUS/td/tr/table

tr中设置高度前端技术开发03tr标签中只能设置高度，不能设置宽度当tr都设置了height值时，各个tr的height按照设置的值的比例来分配总的height值行高如何分配？当tr都没有设置height值时，平均分配总的height值。tableborder=1height=300trth排名/thth品牌/thth车型/thth销量/th/trtrtd1/tdtd比亚迪/tdtd秦PLUS/tdtd27851/td/trtrtd2/tdtd特斯拉/tdtdModelY/tdtd22537/td/tr/table

tr中设置高度前端技术开发03tr标签中只能设置高度，不能设置宽度当tr都设置了height值时，各个tr的height按照设置的值的比例来分配总的height值行高如何分配？当tr都没有设置height值时，平均分配总的height值。tableborder=1height=300trheight=80