文章详情页
css - 苏宁易购M站
浏览：96日期：2023-07-24 14:15:00
问题描述
最近看苏宁app的源码说是泄漏了，逐看了下他们的网站M站，发现有段css写的看不太明白，望大婶们指点：
html {font-size: 50px}body {font-size: 24px}@media screen and(min-width: 320px) { html { font-size: 21.33px} body { font-size: 12px}}@media screen and(min-width: 360px) { html { font-size: 24px } body { font-size: 12px }}@media screen and(min-width: 375px) { html { font-size: 25px } body { font-size: 12px }}@media screen and(min-width: 384px) { html { font-size: 25.6px } body { font-size: 14px }}@media screen and(min-width: 400px) { html { font-size: 26.67px } body { font-size: 14px }}
如上，那些body跟html的字体比例是如何计算而来的？
问题解答
回答1：使用了css3 里的媒体查询， 当屏幕宽度为320px时改变html和body里的font-size 下面都一样。 @media screen 媒体查询
不过话说苏宁做的还挺细致的
回答2：根据页面分辨率不同显示效果自主设定的，没有特别的计算规则。
标签：
CSS
相关文章：
1. python如何不改动文件的情况下修改文件的 修改日期2. angular.js - 不适用其他构建工具，怎么搭建angular1项目3. angular.js - Angular路由和express路由的组合使用问题4. python - django 里自定义的 login 方法，如何使用 login_required()5. java8中，逻辑与 & 符号用在接口类上代表什么意思6. mysql优化 - mysql count(id)查询速度如何优化?7. mysql主从 - 请教下mysql 主动-被动模式的双主配置 和 主从配置在应用上有什么区别？8. 主从备份 - 跪求mysql 高可用主从方案9. node.js - node_moduls太多了10. python - 关于ACK标志位的TCP端口扫描的疑惑？
排行榜
网公网安备