当前位置: 首页 > Web前端 > HTML

rem布局

时间:2023-04-02 19:53:26 HTML

先说说rem的布局:rem对应html{font-size:"setvalue"}其中html中font-size的设置值是rem的唯一参考,1rem=这个设置值.响应式布局,灵活布局也不错,这里要注意如何处理这个rem。这里要看你的具体需求了:1:引入淘宝的flexible2:写js动态计算html的font-size的值3:通过@mediascreenand(min-width:minimumvalue)and(max-width:maximumvalue)){html{font-size:设置值}},控制屏幕范围来控制rem的值。这里我更喜欢第三种:1:个人喜欢,虽然有点麻烦;2:更柔软,更灵活,兼容第三方UI框架,这也是最重要的原因。有时候你引入的js动态改变了rem,和你引入UI框架的css冲突,导致样式超小或者超大;3:也可以根据屏幕大小制定专属的rem,调试后可以达到在各类型模型下的最佳效果今天也遇到了禁用滚动条显示但不禁用滚动条的方法effect:::-webkit-scroller{display:none}直接在包装元素中添加这个类