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

    css中vw有没有兼容问题

    长期闲置长期闲置2022-04-27 18:05:59原创226

    css中vw有兼容问题。vw的兼容性:1、桌面PC中,vw兼容Chrome26、Firefox19、Safari6.1、IE10和Opera15以上的版本;2、移动设备中,vw兼容Android4.4和iOS8以上的版本。

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

    css中vw有没有兼容问题

    桌面 PC

    Chrome:自 26 版起就完美支持(2013年2月)

    Firefox:自 19 版起就完美支持(2013年1月)

    Safari:自 6.1 版起就完美支持(2013年10月)

    Opera:自 15 版起就完美支持(2013年7月)

    IE:自 IE10 起(包括 Edge)到现在还只是部分支持(不支持 vmax,同时 vm 代替 vmin)

    移动设备

    Android:自 4.4 版起就完美支持(2013年12月)

    iOS:自 iOS8 版起就完美支持(2014年9月).

    扩展知识:

    (1)vw、vh、vmin、vmax 是一种视窗单位,也是相对单位。它相对的不是父节点或者页面的根节点。而是由视窗(Viewport)大小来决定的,单位 1,代表类似于 1%。

    视窗(Viewport)是你的浏览器实际显示内容的区域—,换句话说是你的不包括工具栏和按钮的网页浏览器。

    (2)具体描述如下:

    vw、vh与%百分比的区别

    (1)% 是相对于父元素的大小设定的比率,vw、vh 是视窗大小决定的。

    (2)vw、vh 优势在于能够直接获取高度,而用 % 在没有设置 body 高度的情况下,是无法正确获得可视区域的高度的,所以这是挺不错的优势。

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

    以上就是css中vw有没有兼容问题的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:css
    上一篇:jquery怎么增加兄弟节点 下一篇:css中伪类及伪对象是什么意思
    VIP课程(WEB全栈开发)

    相关文章推荐

    • 【腾讯云】年中优惠,「专享618元」优惠券!• css3如何实现鼠标点击图片放大• css ul标签怎么去掉圆点• div css的布局较table布局有什么优点• css怎么实现英文小写转为大写• css怎么实现带横线的箭头
    1/1

    PHP中文网