• 技术文章 >web前端 >前端问答

    css3新增了哪些单位

    青灯夜游青灯夜游2022-01-12 17:17:07原创74

    css3新增的单位:1、“ch”,字符0的宽度;2、“rem”,一个相对单位,主要是相对于根元素字体的大小;3、“vw”,视窗宽度;4、“vh”,视窗高度;5、“vmin”;6、“vmax”等。

    本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。

    CSS3中新增的长度单位

    CSS3中新增的长度单位有如下,

    新增的viewpoint相关的单位一般是针对移动设备的。

    rem其实跟em是一回事,只不过rem多了一个限制条件,它表示根元素(html元素)的font-size。

    remem的区别,我们可以通过下面这个例子来看一看,

    <html style="font-size: 12px;">
    <body>
        <div id="div1" style="font-size: 16px">
            <div id="div2" style="font-size: 1.2em"></div>
            <div id="div3" style="font-size: 1.2rem">
                <div id="div4" style="font-size: 1.2em"></div>
            </div>
        </div>
    </body>
    </html>

    此时,

    可见,rem不存在级联关系,而em存在级联关系。

    值得注意的是,IE8及以下、Safari 4、IOS 3.2等不支持rem单位。

    (学习视频分享:css视频教程

    以上就是css3新增了哪些单位的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:css3 单位
    上一篇:h5和css3有什么优点 下一篇:33个非常实用的JavaScript一行代码,建议收藏!

    相关文章推荐

    • css3怎样实现网页的淡入效果• css3的伪类和伪元素的区别是什么• css3背景怎么实现线性渐变• css3属性选择器包括哪几种• css3向左偏移是什么样式

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网