1.px 使用具体像素点为单位，好处是比较稳定和精确，但在浏览器放大缩小会出现问题

2.rem 参考根元素的值
　　例如设置根元素字体大小是20像素
　　

　　在h1中设置字体大小

　　

　　那么H1的大小就是40px

　　p的像素是20*0.8就是16像素

3.vw是针对于可是窗口的大小，就是窗口的大小，或者手机屏幕的大小

　　个人觉得这个不错

　　

意思就是字体占整个可视窗口的百分之四，是根据可视窗口来变化的。
 
 
第一次玩博客，以后会经常分享一些在前端中遇到的问题，和解决办法。

px与与rem vw的区别的更多相关文章

  1. 网页常见单位： px em pt % rem vw、vh、vmin、vmax ， rem 使用

    1.网页常见单位:  px  em  pt    vw\vh   rem 1.1 px单位名称为像素,相对长度单位,像素(px)是相对于显示器屏幕分辨率而言  (最终解析单位) em单位名称为相对长度 ...

  2. px em 和rem之间的区别

    背景: px:像素是相对于显示器屏幕分辨率而言的相对长度单位.pc端使用px倒也无所谓,可是在移动端,因为手机分辨率种类颇多,不可能一个个去适配,这时px就显得非常无力,所以就要考虑em和rem. e ...

  3. 彻底弄懂px,em和rem的区别

    国内的设计大师都喜欢用px,而国外的网站大都喜欢用em和rem,那么三者有什么区别,又各自有什么优劣呢? px特点: 1.IE无法调整那些使用px作为单位的字体大小: 2.国外大部分网站能够调整的原因 ...

  4. css中字体常用单位px、em、rem和%的区别及用法总结

    一.px.em.rem和%的定义 1.px(像素) px单位的名称为像素,它是一个固定大小的单元,像素的计算是针对(电脑/手机)屏幕的,一个像素(1px)就是(电脑/手机)屏幕上的一个点,即屏幕分辨率 ...

  5. css单位介绍em ex ch rem vw vh vm cm mm in pt pc px

    长度单位主要有以下几种em ex ch rem vw vh vm cm mm in pt pc px %,大概可以分为几种"绝对单位"和"相对单位"和" ...

  6. css中content-box和border-box当宽度为百分比时的位置区别，vw和%区别

    盒模型 参考代码 // CSS 部分 <style> .box1,.box2{ width: 200px; height: 200px; padding: 20px; margin: 20 ...

  7. px,pt,em,rem

    一直对px,pt,em,rem的认识有误区,现整理一下,供参考.之后还得整理下关于dpi相关的知识. px(pixe,像素l):是一个虚拟长度单位,是计算机系统的数字化图像长度单位,如果px要换算成物 ...

  8. 小tips：使用rem+vw实现简单的移动端适配

    首先设置meta属性,如下代码: <meta name="viewport" content="width=device-width, initial-scale= ...

  9. Vue将px转化为rem适配移动端

    Vue将px转化为rem适配移动端 1.下载lib-flexible我使用的是vue-cli+webpack,所以是通过npm来安装的npm i lib-flexible --save 2.引入lib ...

随机推荐

  1. Flash3D学习计划（四）——学习纹理相关知识，载入一张纹理，并应用于前面的矩形；并学习多层纹理映射相关知识，尝试dark map, glow map

    实现效果   主要代码   package { import com.adobe.utils.AGALMiniAssembler; import com.adobe.utils.Perspective ...

  2. 学习Flash 3D图形图像知识的网络资源集合

    1. 华中科技大学计算机学院开放式课程--计算机图形学 http://cs.hust.edu.cn/webroot/courses/csgraphics/index.php 2.深入Stage3D_7 ...

  3. 八. 输入输出(IO)操作8.文件的压缩处理

    Java.util.zip 包中提供了可对文件的压缩和解压缩进行处理的类,它们继承自字节流类OutputSteam 和 InputStream.其中 GZIPOutputStream 和 ZipOut ...

  4. ife2015-task2-javascript-util.js

    util.js/** * Created by Administrator on 2016/12/14. *///判断是否为数组function isArray(arr){ return (arr i ...

  5. Android学Jni/Ndk 开发记录（一）

      治疗拖延症的唯一办法就是:一想起些什么 / 要做些什么就 TM 立马去做! 是的,突然想起我不会 JNI.NDK 开发.解决办法:立马去学! 一:配置 NDK 环境 下载 NDK 写入到配置文件 ...

  6. SQL SERVER 2012 尝试读取或写入受保护的内存。这通常指示其他内存已损坏。 (System.Data)

    标题: 连接到服务器------------------------------ 无法连接到 192.168.1.253. ------------------------------其他信息: 尝试 ...

  7. 用word2vec对语料进行训练

    在Linux上安装好word2vec, 进入trunk文件夹,把分词后的语料文件放在trunk文件夹内,执行:./word2vec -train tt.txt -output vectors.bin ...

  8. bind域名dns解析及主从服务的配置

    bind域名dns解析及主从服务的配置 1.dns解析介绍     人们习惯记忆域名,但机器间互相只认IP地址,域名与IP地址之间是多对一的关系,一个ip地址不一定只对应一个域名,且一个域名只可以对应 ...

  9. Elasticsearch教程（九） elasticsearch 查询数据 | 分页查询

    Elasticsearch  的查询很灵活,并且有Filter,有分组功能,还有ScriptFilter等等,所以很强大.下面上代码: 一个简单的查询,返回一个List<对象> ..    ...

  10. JNI 函数注册与管理

    class<--> 一一对应so-->method     每个so对应于一个类对象 类中的每个native方法对应 于so中的一个native的function,对应关系涉及 {c ...