px:单位代表像素,1px代表一个像素点。

%:设置子元素为父容器的占比。

em:代表该元素中一个字体所占字符,常用在文字首行缩进。其具有继承性。

rem:始终代表html中的字符所在位置。

vm:1vm代表占据视窗宽度的百分之1.

vh:1vh代表占据视窗高度的百分之1.

vmax:选取vh和vm中最大的哪一个。

vmin:选取vh和vw中最小的哪一个。

fr:并没有具体的值,代表一个均分单位,例如:在水平上只分出1fr,则1fr代表整个视窗宽度,

  如分成3个1fr,则1fr代表视窗宽度的1/3.

CSS单位分析的更多相关文章

  1. css单位分析、颜色设置与调色板

    CSS单位分析 px:单位代表像素,1px代表一个像素点. %:设置子元素为父容器的占比. em:代表该元素中一个字体所占字符,常用在文字首行缩进.其具有继承性. rem:始终代表html中的字符所在 ...

  2. 你可能没注意的CSS单位

    扶今追昔 CSS中的单位我们经常用到px.pt.em.百分比,px和pt不用多说 em em是相对单位,参考物是父元素的font-size,具有继承的特点 如果字体大小是16px(浏览器的默认值),那 ...

  3. css单位盘点

    css单位有:px,em,rem,vh,vw,vmin,vmax,ex,ch 等等 1.px单位最常见,也最直接,这里不做介绍. 2.em:em的值并不是固定,它继承父级元素的字体大小,所以层数越深字 ...

  4. 你可能不知道的7个CSS单位

    如果你是一名前端开发工程师,一般px和em使用频率比较高.但是今天本文的重点是介绍一些我们使用很少.甚至么有听说的单位. 一.重温em <style type="text/css&qu ...

  5. 学习网页制作中如何在正确选取和使用 CSS 单位

    在 CSS 测量系统中,有好几种单位,如像素.百分比.英寸.厘米等等,Web 开发人员很难了解哪些单位在何处使用,如何使用.很多人习惯了总是使用同一种单位,但这一决定可能会严重限制你的设计的执行. 这 ...

  6. 七个你可能不了解的CSS单位

    我们很容易无法摆脱的使用我们所熟悉的CSS技术,当新的问题出现,这样会使我们处于不利的地位. 随着Web继续的发展,对新的解决方案的需求也会继续增大.因此,作为网页设计师和前端开发人员,我们别无选择, ...

  7. CSS:CSS 单位

    ylbtech-CSS:CSS 单位 1.返回顶部 1. 尺寸 单位 描述 % 百分比 in 英寸 cm 厘米 mm 毫米 em 1em 等于当前的字体尺寸. 2em 等于当前字体尺寸的两倍. 例如, ...

  8. rem — 一个低调的css单位

    原文  http://www.zhaoan.org/1825.html rem这是个低调的 css 单位,近一两年开始崭露头角,有许多同学对rem的评价不一,有的在尝试使用,有的在使用过程中遇到坑就弃 ...

  9. css单位中px和em,rem的区别

    css单位中分为相对长度单位.绝对长度单位. 今天我们主要讲解rem.em.px这些常用单位的区别和用法. px(绝对长度单位) 相信对于前端来说px这个单位是大家并不陌生,px这个单位,兼容性可以说 ...

随机推荐

  1. 阿里云服务器ECS web环境配置(LNAP)ubantu

    Ubuntu 系统中,可以使用 apt-get 命令来搭建 LNMP环境.这种方式较编译方式安装更加简便 安装Nginx 1.使用 sudo apt-get install nginx 就能自动安装 ...

  2. linux基础命令---df

    df 显示磁盘分区上的磁盘使用状况,可以显示出文件系统名称.大小.挂载点等信息.df显示包含每个文件名参数的文件系统上可用的磁盘空间.如果不给出文件名,则显示所有当前挂载的文件系统上可用的空间.默认情 ...

  3. bzoj1633 / P2875 [USACO07FEB]牛的词汇The Cow Lexicon

    P2875 [USACO07FEB]牛的词汇The Cow Lexicon 三维dp 它慢,但它好写. 直接根据题意设三个状态: $f[i][j][k]$表示主串扫到第$i$个字母,匹配到第$j$个单 ...

  4. 06: AJAX全套 & jsonp跨域AJAX

    目录: 1.1 AJAX介绍 1.2 jQuery AJAX(第一种) 1.3 原生ajax(第二种) 1.4 iframe“伪”AJAX(第三种) 1.5 jsonp跨域请求 1.6 在tornad ...

  5. C_Learning (1)

    /数据类型及占用字节 char   1个字节{-128~127} int    2.4个字节,取决于平台是16位还是32位机子{-65536~65535} short int  2个字节{-32768 ...

  6. html模板生成静态页面及模板分页处理

    它只让你修改页面的某一部分,当然这"某一部分"是由你来确定的.美工先做好一个页面,然后我们把这个页面当作模板(要注意的是这个模板就没必要使用EditRegion3这样的代码了,这种 ...

  7. 关于定时器、波特率、TH和TL值的计算

    假设晶振位6MHZ,定时10ms 单片机系统晶振频率为6mhz,系统时钟频率 (也是计时脉冲频率)为500KHZ,一个脉冲周期2us ,10ms是5000个脉冲,因此TMOD=0X01;TH0=(65 ...

  8. C# Byte[] 数组操作

    byte[] Strbyte = Encoding.GetEncoding("big5").GetBytes(str);            if (Strbyte.Length ...

  9. 1、webpack编译打包Sass编译的css进js文件

    cnpm install css-loader --save-dev    //css-loader 是将css打包进js cnpm install style-loader --save-dev   ...

  10. js媒体查询设置根字号

    !function(n){var e=n.document,t=e.documentElement,i=750,d=i/50,o="orientationchange"in n?& ...