zoukankan      html  css  js  c++  java
  • css中添加屏幕自适应方法(rem)

    css中添加屏幕自适应方法(rem)

    只需要在公共css文件中添加下面代码:设计稿以750px,基础字体为20px为例,兼容性高,使用过程中px转化为rem即可

    /*竖屏*/
    @media screen and (max-aspect-ratio: 13/9){
        html {font-size:calc(100vw / 750 * 100);}
        @media screen and (min- 750px) {
            html{font-size:100px;max-750px;}
        }
    }
    /*横屏*/
    @media screen and (min-aspect-ratio: 13/9) {
        html {font-size:calc(100vmax / 750 * 100);}
        html .lockScreenTip {display:block;}
        html.input_focus .lockScreenTip {display:none;} 
        @media screen and (min- 750px) {
            html{font-size:100px;max-750px;}
        }
    }
  • 相关阅读:
    linux getch()实现
    cppcheck 下载与安装(Liunx)
    apt-get 命令
    nanopb 文档
    VS调试技术
    c 单元测试 check
    GDB 调试
    GCC选项 –I,-l,-L
    作业66
    zhuoye
  • 原文地址:https://www.cnblogs.com/chao202426/p/10188405.html
Copyright © 2011-2022 走看看