rem+媒体查询---移动端 设计稿以375

复制代码
@media screen and (max-width: 319px) {
  html {
    font-size: 85.33333px
  }
}

@media screen and (min-width: 320px) and (max-width: 359px) {
  html {
    font-size: 85.33333px
  }
}

@media screen and (min-width: 360px) and (max-width: 374px) {
  html {
    font-size: 96px
  }
}

@media screen and (min-width: 375px) and (max-width: 383px) {
  html {
    font-size: 100px
  }
}

@media screen and (min-width: 384px) and (max-width: 399px) {
  html {
    font-size: 102.4px
  }
}

@media screen and (min-width: 400px) and (max-width: 411px) {
  html {
    font-size: 106.66667px
  }
}

@media screen and (min-width: 412px) and (max-width: 413px) {
  html {
    font-size: 109.86667px
  }
}

@media screen and (min-width: 414px) {
  html {
    font-size: 110.4px
  }
}
复制代码

 

posted @   吾生有涯,而知无涯!  阅读(1502)  评论(0编辑  收藏  举报
编辑推荐:
· Linux glibc自带哈希表的用例及性能测试
· 深入理解 Mybatis 分库分表执行原理
· 如何打造一个高并发系统?
· .NET Core GC压缩(compact_phase)底层原理浅谈
· 现代计算机视觉入门之:什么是图片特征编码
阅读排行:
· 手把手教你在本地部署DeepSeek R1,搭建web-ui ,建议收藏!
· Spring AI + Ollama 实现 deepseek-r1 的API服务和调用
· 数据库服务器 SQL Server 版本升级公告
· 程序员常用高效实用工具推荐,办公效率提升利器!
· C#/.NET/.NET Core技术前沿周刊 | 第 23 期(2025年1.20-1.26)
点击右上角即可分享
微信分享提示