• 视图适配


    @media only screen and (max-320px){.lincoapp-home-slideImage a{min-height:165px}
    }
    @media only screen and (min-321px) and (max-360px){.lincoapp-home-slideImage a{min-height:185px}
    }
    @media only screen and (min-361px) and (max-375px){.lincoapp-home-slideImage a{min-height:193px}
    }
    @media only screen and (min-376px) and (max-384px){.lincoapp-home-slideImage a{min-height:198px}
    }
    @media only screen and (min-385px) and (max-393px){.lincoapp-home-slideImage a{min-height:203px}
    }
    @media only screen and (min-394px) and (max-400px){.lincoapp-home-slideImage a{min-height:206px}
    }
    @media only screen and (min-401px){.lincoapp-home-slideImage a{min-height:213px}
    }



    @media screen and (min- 1025px){
    body {
    font-family: "Helvetica Neue",Helvetica,"Hiragino Sans GB","Microsoft YaHei",Arial,sans-serif;
    }
    }
    @media screen and (min- 1024px){
    body {
    background-color: #fff;
    }
    }

    @media (-webkit-min-device-pixel-ratio: 2) and (max-device- 667px) and (min-device- 375px) {
    .mm_appmsg .rich_media_meta, .mm_appmsg .rich_media_inner {
    font-size: 17px;
    }
    }

    @media (-webkit-min-device-pixel-ratio: 3) and (max-device- 736px) and (min-device- 414px) {
    .mm_appmsg .rich_media_title {
    font-size: 25px;
    }
    }

     max-widht指展示的最大宽度,一般是浏览器窗口宽度。
    max-device-width是指所展示使用的设备支持宽度,如一般电脑分辨率1280px,手机设备支持展示宽度(安卓有种宽度如360 ,480)等.

     -webkit-min-device-pixel-ratio: 设备像素比

    .icon {
      background-image: url(example.png); /* 普通尺寸图片 */
      background-size: 200px 300px;
      height: 300px;
       200px;
    }
    
    @media only screen and (-Webkit-min-device-pixel-ratio: 1.5),
    only screen and (-moz-min-device-pixel-ratio: 1.5),
    only screen and (-o-min-device-pixel-ratio: 3/2),
    only screen and (min-device-pixel-ratio: 1.5) {
      .icon {
        background-image: url(example@2x.png); /* 2倍尺寸图片 */
      }
    }
  • 相关阅读:
    【微服务架构】SpringCloud组件和概念介绍(一)
    getaddrinfo()详解
    通货膨胀背景下,只能好好搞技术了
    到此为止,重新开始
    二级指针
    一篇关于spice vdagent和利用virtmanager配置spice的文章
    局域网中两台无线路由器联接配置方法图文教程
    ovirt简介
    IIS fastcgi 超时处理
    关于eclipse无法自动编译的问题
  • 原文地址:https://www.cnblogs.com/y896926473/p/5324131.html
Copyright © 2020-2023  润新知