首先写入一下代码

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">

然后在CSS中写入

大于641 的字体是20px,那么30px就是1.5rem,用实际像素除以20,就是rem的单位

例如 设置16px  就是0.8rem

这样在缩放窗口的时候,字体会跟随缩放的窗口变大变小

rem的使用方法的更多相关文章

  1. html5 750 REM JS换算方法

    在安卓手机低版本浏览器,如果进页面快速执行的话会出现计算宽度不正确的情况,解决方法是放在onload方法里面执行,但这种解决方式在一些高版本浏览器中会出现页面闪动,所以使用判断浏览器版本的方式来解决, ...

  2. rem 自适应适配方法

    rem是指相对于根元素(html)的字体大小的单位,它是一个相对单位,它是css3新增加的一个单位属性,我们现在有很多人用的都是px,但px是一个绝对单位,遇到分辨率不同的设备,做出的页面可能会乱,这 ...

  3. vue-cli3.0 使用postcss-plugin-px2rem(推荐)和 postcss-pxtorem(postcss-px2rem)自动转换px为rem 的配置方法;

    如何在vue-cli3.0中使用postcss-plugin-px2rem 插件 插件的作用是 自动将vue项目中的px转换为rem . 为什么这三个中要推荐  postcss-plugin-px2r ...

  4. H5 页面 rem 布局适配方法

    rem 布局适配方案 主要方法为: 按照设计稿与设备宽度的比例,动态计算并设置 html 根标签的 font-size 大小: css 中,设计稿元素的宽.高.相对位置等取值,按照同等比例换算为 re ...

  5. 移动端rem.js使用方法

    下面的代码一是我根据rem的使用经验,自己写的一个rem.js,发现很好用,能适用所有移动端h5页面的自适应需求: 代码一: ``` window.onload = function(){ /*720 ...

  6. 移动端适配(rem单位定义方法)

    注:移动端必须写: <meta name="viewport" content="width=device-width, user-scalable=no, ini ...

  7. rem详解及使用方法

    好像有一段时间没有写博客了……今天刚好总结一下rem的使用方法 首先,先说一个常识,浏览器的默认字体高都是16px.步入正题-----〉 兼容性: 目前,IE9+,Firefox.Chrome.Saf ...

  8. H5中REM中使用的规则

    /*REM单位换算方法 iphone6适配*/ function resizeRoot(){ var Dpr = 1, uAgent = window.navigator.userAgent; var ...

  9. 浅谈rem、em、px

    1.px:像素(Pixel) px是相对长度单位,他是相对于显示器屏幕分辨率而言的 优点:比较稳定.精确 缺点:在浏览器 中放大或者缩小浏览页面,会出现页面混乱的情况. 如下例子: .buttonPX ...

随机推荐

  1. 创建 git仓库

    首先创建一个文件夹作为git仓库,创建一个test文件夹,并在文件夹下创建一个test.c的文件用以测试: git init git使用git init来初始化一个git仓库,git的很多命令都是在g ...

  2. http://blog.csdn.net/huang_xw/article/details/7090173

    http://blog.csdn.net/huang_xw/article/details/7090173

  3. webservice ssl双向认证配置

    1.在tomcat中安装axis2插件 2.生成证书,用jdk自带的keytool 服务端 keytool -genkey -alias Server -dname "CN=192.168. ...

  4. IBM AppScan安全測试一例——已解密的登录请求

    问题严重级别:高 此类问题在做政府项目(第三方软件评測中心)验收的时,须要马上整改.例如以下图:

  5. PHP微信墙制作

    微信墙 PHP 注意:由于微信官网不定时会更新,其中模拟登陆以及爬取数据的方式可能会失效,最近这12个月里,就有两次更新导致此功能需要重写. 服务端源码->github地址传送门 思路 其实实现 ...

  6. 深入NIO Socket实现机制(转)

    http://www.jianshu.com/p/0d497fe5484a# 前言 Java NIO 由以下几个核心部分组成: Buffer Channel Selector 以前基于net包进行so ...

  7. spark完全分布式集群搭建

    最近学习Spark,因此想把相关内容记录下来,方便他人参考,也方便自己回忆吧 spark开发环境的介绍资料很多,大同小异,很多不能一次配置成功,我以自己的实际操作过程为准,详细记录下来. 1.基本运行 ...

  8. React Router V4发布

    React Router V4 正式版发布,该版本相较于前面三个版本有根本性变化,遵循 Just Component 的 API 设计理念. 本次升级的主要变更有: 声明式 Declarative 可 ...

  9. Django——如何处理请求(URL配置和视图)

    URLconfig—— 为了绑定视图函数和URL,我们使用URLconf. URLconf 就像是 Django 所支撑网站的目录. 它的本质是 URL 模式以及要为该 URL 模式调用的视图函数之间 ...

  10. grid 布局 等比例

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...