/* 创建媒体查询公共css，设置常见的屏幕尺寸，修改里面的html文字大小 */

/* 台式电脑、笔记本电脑、横屏平板电脑，设计响应式布局时，均以1920px为文稿设计宽度。范围为1024-1920px */
/* 竖屏平板电脑、各种手机，设计响应式布局时，均以720px为文稿设计宽度。范围为280-912px */

/* 将所有横屏显示设备的整个屏幕宽度划分为40份 */
/* 将所有竖屏显示设备的整个屏幕宽度划分为30份 */

/* 以下屏幕尺寸均由大到小排列 UTD */

/* 基本字体大小定义 */
html {
    font-size: 48px;
}

/* 一、电脑类（台式和笔记本，均为横屏） */
/* 一1、针对最流行的桌面大屏幕：1920px x 1080px */
@media screen and (max-width: 2000px) {
    html {
        font-size: 48px;
    }
}
/* 一1、针对最流行的桌面大屏幕：1920px x 1080px */
@media screen and (max-width: 1800px) {
    html {
        font-size: 43px;
    }
}
/* 一2、针对较流行的桌面屏幕：1440px x 900px */
@media screen and (max-width: 1600px) {
    html {
        font-size: 38px;
    }
}
/* 一2、针对较流行的桌面屏幕：1440px x 900px */
@media screen and (max-width: 1500px) {
    html {
        font-size: 36px;
    }
}
/* 一3、针对较旧的桌面屏幕：1366px x 768px */
@media screen and (max-width: 1400px) {
    html {
        font-size: 33px;
    }
}


/* 二、平板电脑类 */
/* 横屏 */
/* 二1、针对横屏式的平板电脑如Nest Max 屏幕：1280px x 800px */
@media screen and (max-width: 1300px) {
    html {
        font-size: 31px;
    }
}
/* 二2、针对横屏式的平板电脑如Nest Hub 等屏幕：1024px x 600px 或1024px x 768px */
@media screen and (max-width: 1100px) {
    html {
        font-size: 26px;
    }
}

/* 竖屏-横屏*/
/* 二3、针对竖屏式的平板电脑如iPad Pro 等屏幕：1024px x 1366px 也按横屏对待*/
/* 二3按二2媒体查询代码处理。竖屏暂按横屏对待 */

/* 竖屏 */
/* 二4、针对竖屏式的平板电脑如Surface Pro 7 等屏幕：912px x 1368px */
@media screen and (max-width: 950px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 51px;
        /* 屏幕宽度平分20份 */
        /* font-size: 45.6px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 30.4px; */
    }
}
/* 二5、针对竖屏式的平板电脑如 Asus Zenbook Fold 等屏幕：853px x 1280px */
@media screen and (max-width: 870px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 47px;
        /* 屏幕宽度平分20份 */
        /* font-size: 42.65px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 28.4333px; */
    }
}
/* 二6、针对竖屏式的平板电脑如iPad Air 等屏幕：820px x 1180px */
@media screen and (max-width: 830px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 46px;
        /* 屏幕宽度平分20份 */
        /* font-size: 41px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 27.3333px; */
    }
}
/* 二7、针对竖屏式的平板电脑如iPad Mini 等屏幕：768px x 1024px */
@media screen and (max-width: 800px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 43px;
        /* 屏幕宽度平分20份 */
        /* font-size: 38.4px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 25.6px; */
    }
}


/* 三、手机类 */
/* 三1、针对常见的较大手机屏幕：750px x ？ */
@media screen and (max-width: 760px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 42px;
        /* 屏幕宽度平分20份 */
        /* font-size: 37.5px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 25px; */
    }
}
/* 三2、针对大部分4.7~5寸的安卓设备手机屏幕：720px x ？*/
@media screen and (max-width: 730px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 40px;
        /* 屏幕宽度平分20份 */
        /* font-size: 36px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 24px; */
    }
}
/* 二3、针对针对Surface Duo 及其它普通手机等手机屏幕：540px x 720px */
@media screen and (max-width: 700px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 39px;
        /* 屏幕宽度平分20份 */
        /* font-size: 27px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 18px; */
    }
}
/* 二3、针对针对Surface Duo 及其它普通手机等手机屏幕：540px x 720px */
@media screen and (max-width: 680px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 38px;
        /* 屏幕宽度平分20份 */
        /* font-size: 27px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 18px; */
    }
}
/* 二3、针对针对Surface Duo 及其它普通手机等手机屏幕：540px x 720px */
@media screen and (max-width: 660px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 37px;
        /* 屏幕宽度平分20份 */
        /* font-size: 27px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 18px; */
    }
}
/* 二3、针对针对Surface Duo 及其它普通手机等手机屏幕：540px x 720px */
@media screen and (max-width: 640px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 36px;
        /* 屏幕宽度平分20份 */
        /* font-size: 27px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 18px; */
    }
}
/* 二3、针对针对Surface Duo 及其它普通手机等手机屏幕：540px x 720px */
@media screen and (max-width: 620px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 35px;
        /* 屏幕宽度平分20份 */
        /* font-size: 27px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 18px; */
    }
}
/* 二3、针对针对Surface Duo 及其它普通手机等手机屏幕：540px x 720px */
@media screen and (max-width: 600px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 33px;
        /* 屏幕宽度平分20份 */
        /* font-size: 27px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 18px; */
    }
}
/* 二3、针对针对Surface Duo 及其它普通手机等手机屏幕：540px x 720px */
@media screen and (max-width: 580px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 32px;
        /* 屏幕宽度平分20份 */
        /* font-size: 27px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 18px; */
    }
}
/* 二3、针对针对Surface Duo 及其它普通手机等手机屏幕：540px x 720px */
@media screen and (max-width: 560px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 31px;
        /* 屏幕宽度平分20份 */
        /* font-size: 27px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 18px; */
    }
}
/* 二3、针对针对Surface Duo 及其它普通手机等手机屏幕：540px x 720px */
@media screen and (max-width: 540px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 30px;
        /* 屏幕宽度平分20份 */
        /* font-size: 27px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 18px; */
    }
}
/* 二3、针对针对Surface Duo 及其它普通手机等手机屏幕：540px x 720px */
@media screen and (max-width: 520px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 29px;
        /* 屏幕宽度平分20份 */
        /* font-size: 27px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 18px; */
    }
}
/* 三4、针对普通手机屏幕：480px x ？ */
@media screen and (max-width: 500px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 28px;
        /* 屏幕宽度平分20份 */
        /* font-size: 24px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 16px; */
    }
}
/* 三4、针对普通手机屏幕：480px x ？ */
@media screen and (max-width: 480px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 27px;
        /* 屏幕宽度平分20份 */
        /* font-size: 24px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 16px; */
    }
}
/* 三4、针对普通手机屏幕：480px x ？ */
@media screen and (max-width: 460px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 26px;
        /* 屏幕宽度平分20份 */
        /* font-size: 24px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 16px; */
    }
}
/* 三4、针对普通手机屏幕：480px x ？ */
@media screen and (max-width: 440px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 24px;
        /* 屏幕宽度平分20份 */
        /* font-size: 24px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 16px; */
    }
}
/* 三5、针对iPhone \14\Pro\Max 等手机屏幕：430px x 932px */
@media screen and (max-width: 435px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 24px;
        /* 屏幕宽度平分20份 */
        /* font-size: 21.5px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 14.3333px; */
    }
}
/* 三6、针对普通手机屏幕：424px x ？ */
@media screen and (max-width: 430px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 23.8px;
        /* 屏幕宽度平分20份 */
        /* font-size: 21.2px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 14.1333px; */
    }
}
/* 三7、针对最常见的iPhone X\XS\XR\11\Pro等手机屏幕：414px x 896px */
/* 三8、针对Pixel 7 \ Samsung Galaxy S20 Ultra \ A51\71 等手机屏幕：412px x 915px(914px) */
/* 三7、三8均按三7媒体查询代码处理 */
@media screen and (max-width: 420px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 23.3px;
        /* 屏幕宽度平分20份 */
        /* font-size: 20.7px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 13.8px; */
    }
}
@media screen and (max-width: 415px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 23px;
        /* 屏幕宽度平分20份 */
        /* font-size: 20.7px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 13.8px; */
    }
}
@media screen and (max-width: 410px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 22.8px;
        /* 屏幕宽度平分20份 */
        /* font-size: 20.7px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 13.8px; */
    }
}
/* 三9、针对普通手机屏幕：400px x ？ */
@media screen and (max-width: 402px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 22.2px;
        /* 屏幕宽度平分20份 */
        /* font-size: 20px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 13.3333px; */
    }
}
/* 三10、针对iPhone \12\Pro手机屏幕：390px x 844px */
@media screen and (max-width: 392px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 21.7px;
        /* 屏幕宽度平分20份 */
        /* font-size: 19.5px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 13px; */
    }
}
/* 三11、针对普通手机屏幕：384px x ？ */
@media screen and (max-width: 386px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 21.3px;
        /* 屏幕宽度平分20份 */
        /* font-size: 19.2px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 12.8px; */
    }
}
/* 三12、针对最常见的iPhone6\7\8\Se等手机屏幕：375px x 667px */
@media screen and (max-width: 378px) {
    html {
        /* 屏幕宽度平分16份 */
        /*font-size: 23.4px;*/
        /* 屏幕宽度平分18份 */
         font-size: 20.8px;
        /* 屏幕宽度平分20份 */
        /* font-size: 18.75px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 12.5px; */
    }
}
/* 三13、针对最常见的安卓手机屏幕：360px x 640px 或Samsung Galaxy S8+手机屏幕：360px x 740px */
@media screen and (max-width: 370px) {
    html {
        /* 屏幕宽度平分16份 */
        /*font-size: 22.5px;*/
        /* 屏幕宽度平分18份 */
         font-size: 20.5px;
        /* 屏幕宽度平分20份 */
        /* font-size: 18px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 12px; */
    }
}
/* 三13、针对最常见的安卓手机屏幕：360px x 640px 或Samsung Galaxy S8+手机屏幕：360px x 740px */
@media screen and (max-width: 362px) {
    html {
        /* 屏幕宽度平分16份 */
        /*font-size: 22.5px;*/
        /* 屏幕宽度平分18份 */
         font-size: 20px;
        /* 屏幕宽度平分20份 */
        /* font-size: 18px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 12px; */
    }
}
@media screen and (max-width: 350px) {
    html {
        /* 屏幕宽度平分16份 */
        /*font-size: 20px;*/
        /* 屏幕宽度平分18份 */
         font-size: 19.4px;
        /* 屏幕宽度平分20份 */
        /* font-size: 18px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 12px; */
    }
}
@media screen and (max-width: 340px) {
    html {
        /* 屏幕宽度平分16份 */
        /*font-size: 22.5px;*/
        /* 屏幕宽度平分18份 */
         font-size: 18.9px;
        /* 屏幕宽度平分20份 */
        /* font-size: 18px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 12px; */
    }
}
/* 三14、针对以前的iPhone4及部分安卓手机屏幕：320px x 480px */
@media screen and (max-width: 330px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 18.3px;
        /* 屏幕宽度平分20份 */
        /* font-size: 16px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 10.6667px; */
    }
}
/* 三15、针对以前的Galaxy Fold 及部分安卓手机屏幕：280px x 653px */
@media screen and (max-width: 320px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 17.8px;
        /* 屏幕宽度平分20份 */
        /* font-size: 14px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 9.3333px; */

    }
}
/* 三15、针对以前的Galaxy Fold 及部分安卓手机屏幕：280px x 653px */
@media screen and (max-width: 310px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 17.2px;
        /* 屏幕宽度平分20份 */
        /* font-size: 14px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 9.3333px; */
        
    }
}
/* 三15、针对以前的Galaxy Fold 及部分安卓手机屏幕：280px x 653px */
@media screen and (max-width: 300px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 16.6px;
        /* 屏幕宽度平分20份 */
        /* font-size: 14px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 9.3333px; */

    }
}
/* 三15、针对以前的Galaxy Fold 及部分安卓手机屏幕：280px x 653px */
@media screen and (max-width: 290px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 16.1px;
        /* 屏幕宽度平分20份 */
        /* font-size: 14px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 9.3333px; */

    }
}
/* 三15、针对以前的Galaxy Fold 及部分安卓手机屏幕：280px x 653px */
@media screen and (max-width: 280px) {
    html {
        /* 屏幕宽度平分18份 */
        font-size: 15.5556px;
        /* 屏幕宽度平分20份 */
        /* font-size: 14px; */
        /* 屏幕宽度平分30份 */
        /* font-size: 9.3333px; */

    }
}