1. width: 设置块元素的宽度. 值: 1) 像素大小, 单位px. 固定的大小 例: width: 100px; 2) 百分比大小, 单位%. 设置当前块元素占据父元素宽度的百分比 例: width: 80%; 3) 字符大小, 单位em. 1.5em表示以父元素的字符大小为基础的1.5倍 例: font-size: 2em; 4) 固定字符大小, 单位rem. 1.5rem表示以页面根元素的字符大小为基础的1.5倍 例:font-size: 2rem; 5) 浏览器百分比大小, 单位 vw vh vmax vmin 2. height: 设置块元素的高度
示例:
1.百分比大小
.box{ background-color: red; width: 80%; height: 300px; }
注:在初次使用百分比大小 时,高度一定要设置固定值,因为初始高度是无限的
2.浏览器百分比大小
*{ margin: 0; padding: 0; } .box{ background-color: red; width: 100vw; height: 100vh; }