在CSS中,100%和100vh这两个单位常常用于设置宽度或高度。但是,这两个单位的具体含义是不同的。100%是相对于容器的宽度或高度来计算的。比如,如果某个元素的宽度设置为100%,那么它会占据父元
在CSS中,100%和100vh这两个单位常常用于设置宽度或高度。但是,这两个单位的具体含义是不同的。
100%是相对于容器的宽度或高度来计算的。比如,如果某个元素的宽度设置为100%,那么它会占据父元素的整个宽度。同理,如果高度设置为100%,那么它会占据父元素的整个高度。
代码示例: .parent { width: 500px; height: 300px; } .child { width: 100%; height: 100%; }
在上述代码中,child元素的宽度和高度都设置为100%,它会占据parent元素的整个宽度和高度。
而100vh表示视口的高度。视口就是浏览器中用于显示网页内容的区域,也就是可见区域。比如,如果某个元素的高度设置为100vh,那么它会占据整个浏览器窗口的高度。
代码示例: .child { height: 100vh; }
在上述代码中,child元素的高度设置为100vh,它会占据整个浏览器窗口的高度。
总之,100%是相对于父元素的宽度或高度,而100vh是相对于浏览器窗口的高度。使用时需要根据具体需求选择不同的单位。
粉丝
0
关注
0
收藏
0