CSS基础属性:width/height

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;
}

版权声明:本文为yiXin_Chen原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。