/*引入适配的less*/
html {
font-size: 16px;
}
@media only screen and (min-width: 320px) {
html {
font-size: 13.6533px !important;
}
}
@media only screen and (min-width: 360px) {
html {
font-size: 15.36px !important;
}
}
@media only screen and (min-width: 375px) {
html {
font-size: 16px !important;
}
}
@media only screen and (min-width: 400px) {
html {
font-size: 17.0667px !important;
}
}
@media only screen and (min-width: 414px) {
html {
font-size: 17.664px !important;
}
}
@media only screen and (min-width: 480px) {
html {
font-size: 20.48px !important;
}
}
@media only screen and (min-width: 750px) {
html {
font-size: 32px !important;
}
}

media适配css的更多相关文章

  1. html5+css3 手机屏幕的适配css

    *{ margin:0;padding:0;outline:0}a{ text-decoration:none}body,html{ font-size:20px;font-family:'Micro ...

  2. @media 适配兼容

    /* 兼容iphone4/4s */ @media (device-height:480px) and (-webkit-min-device-pixel-ratio:2){ } /* 兼容iphon ...

  3. media type与media query

    media type(媒体类型)是css 2中的一个非常有用的属性,通过media type我们可以对不同的设备指定特定的样式,从而实现更丰富的界面.media query(媒体查询)是对media ...

  4. media query(媒体查询)和media type(媒体类型)

    media type(媒体类型)是css 2中的一个非常有用的属性,通过media type我们可以对不同的设备指定特定的样式,从而实现更丰富的界面.media query(媒体查询)是对media ...

  5. web开发中移动端适配

    这个话题有些复杂,说起来有些琐碎,因为和移动端适配相关的问题太多了. 1. 概念 1.1 设备像素 设备像素被称为物理像素,它是显示设备中一个最小的物理部件.每个像素可以根据操作系统设置自己的颜色和亮 ...

  6. mobile css & rem & em & px

    mobile css & rem & em & px 1 rem === 16px 任意浏览器的默认字体高都是 16px, 所有未经调整的浏览器都符合: 1em=16px, 那 ...

  7. CSS中强悍的相对单位之em(em-and-elastic-layouts)学习小记

    使用相对单位em注意点 1.浏览器默认字体是16px,即1em = 16px,根元素设置如下 html{ font-size: 100%; /* WinIE text resize correctio ...

  8. 使用CSS3 Media Queries实现网页自适应

    原文来源:http://webdesignerwall.com 翻译:http://xinyo.org 当今银屏分辨率从 320px (iPhone)到 2560px (大屏显示器)或者更大.人们也不 ...

  9. css判断不同分辨率显示不同宽度布局实现自适应宽度

    一.CSS DIV网页布局中当分辨率小于等于1024px(像素)时,DIV布局对象显示1000px宽度,当分辨率大于1024px时候显示1200px宽度等需求.使用CSS实现改变浏览器显示宽度从而实现 ...

随机推荐

  1. JavaWeb中验证码校验的功能实现

    后台生成验证码工具方法 /* * 设置图片的背景色 */ public static void setBackGround(Graphics g, int WIDTH, int HEIGHT) { / ...

  2. 保护模式中的PDE与PTE

    Windows内核分析索引目录:https://www.cnblogs.com/onetrainee/p/11675224.html 保护模式中的PDE与PTE 1. PDE与PTE的认知 我们在上一 ...

  3. SSL/TLS 链接的建立/握手

    HTTPS 即 HTTP-within-SSL/TLS,其中 SSL/TLS 又分别表示: SSL:Secure Sockets Layer TLS:Transport Layer Security ...

  4. shell 中长命令的换行处理

    考察下面的脚本: emcc -o ./dist/test.html --shell-file ./tmp.html --source-map-base dist -O3 -g4 --source-ma ...

  5. 好看的鼠标hover效果

    0919自我总结 常见的鼠标hover效果 展示效果:http://ianlunn.github.io/Hover/ 部分动画制作 <style><!-- .container { ...

  6. 前端知识体系-NodeJS相关】NodeJS基础知识全面总结

    NodeJS基础知识 1. Node的全局对象和全局变量 1.1 全局对象:所有模块都可以调用的 global:表示Node所在的全局环境,类似于浏览器的window对象. process:该对象表示 ...

  7. localStorage本地存储技术

    localStorage 本地存储技术 本地存储技术,“不是永久的永久存储” 特点: 将数据存储到浏览器当中 存储的数据都是以字符串的形式存储的 和传统的数据库相比: 优点: 操作简单,容易学习 数据 ...

  8. js截取两个字符串之间的子字符串

    // 截取两个字符串之间的子字符串,返回第一个 function subStringOne(text, begin, end) { var regex; if (end == '\\n') regex ...

  9. URL跳转绕过姿势

    POC "@" http://www.target.com/redirecturl=http://whitelist.com@evil.com "\" http ...

  10. TP5 查询mysql数据库时的find_in_set用法

    $where['class_id'] = ['in', '$cid_all']; $where['id'] = ['in', $all_user_id];//或这样子 $where['title'] ...