首页 > 其他分享 >lvh svh dvh

lvh svh dvh

时间:2023-01-16 10:05:16浏览次数:27  
标签:工具栏 dvh svh 单位 视口 动态 lvh viewport 前缀

[11-29] 新的 CSS 视口单位

为了解决移动端网页滚动时,动态工具栏自动收缩的问题,​​CSS​​ 工作组规定了视口的各种状态。

  • ​Large viewport​​(大视口):视口大小假设任何动态工具栏都是收缩状态。
  • ​Small Viewport​​(小视口):视口大小假设任何动态工具栏都是扩展状态。

新的视口也分配了单位:

  • 代表 ​​Large viewport​​​ 的单位以 ​​lv​​​ 为前缀:​​lvw、lvh、lvi、lvb、lvmin、lvmax​​。
  • 代表 ​​Small Viewport​​​ 的单位以 ​​sv​​​ 为前缀:​​svw、svh、svi、svb、svmin、svmax​​。

 

lvh svh dvh_前端


 

另外还有一个 ​​Dynamic viewport​​(动态视口)

当动态工具栏展开时,动态视口等于小视口的大小。 当动态工具栏被缩回时,动态视口等于大视口的大小。

相应的,它的视口单位以 ​​dv​​​ 为前缀:​​dvw, dvh, dvi, dvb, dvmin, dvmax​​。


lvh svh dvh_CSS_02

 

 



标签:工具栏,dvh,svh,单位,视口,动态,lvh,viewport,前缀
From: https://blog.51cto.com/u_15351164/6010057

相关文章