首頁  >  問答  >  主體

css - 苏宁易购M站

最近看苏宁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的字体比例是如何计算而来的?

大家讲道理大家讲道理2767 天前481

全部回覆(2)我來回復

  • 迷茫

    迷茫2017-04-17 11:25:01

    使用了css3 裡的媒體查詢, 當螢幕寬度為320px時改變html和body裡的font-size 下面都一樣。
    @media screen 媒體查詢

    不過話說蘇寧做的還挺細緻的

    回覆
    0
  • 天蓬老师

    天蓬老师2017-04-17 11:25:01

    根據頁面解析度不同顯示效果自主設定的,沒有特別的計算規則。

    回覆
    0
  • 取消回覆