CSS3新单位有哪些?最新CSS3新单位详解

css3新单位有哪些?相信有很多刚刚接触css3的朋友都会有这样的疑问。本章就给大家介绍css3新单位有哪些?最新css3新单位详解。有一定的参考价值,有需要的朋友可以参考一下,希望对你们有所帮助。

css3中引入了一些新的单位:

ch:字符0(零)的宽度;

rem:根元素(html元素)的font-size;

vw:viewpoint width,视窗宽度,1vw等于视窗宽度的1%;

立即学习“前端免费学习笔记(深入)”;

vh:viewpoint height,视窗高度,1vh等于视窗高度的1%;

vmin:vw和vh中较小的那个。

vmain:vw和vh中较大的那个。

deg-角度

显然vw、vh、vmin是针对移动设备的,如果视窗大小变化了,这三个值也会跟着相应的变化。

rem单位感觉就是px+em的变体,是否值得使用还要看你自己的取舍:没有px精确也没有em灵活——或者说,比px灵活,比em更精确~~……XD……

如果没有定义font-size怎么办?

其实不用担心,传说,各个浏览器史无前例的默认font-size:16px;,所以,即便你在样式文件中忘了定义font-size初始值,也可以放心的使用em、rem。

浏览器支持:

rem,各浏览器基本都支持了, IE9+、FF3.6+、Chrome、Safari 5+、以及 Opera 11.6+vw、vh、vmin,浏览器支持并不乐观,IE9支持了,Chrome目前不支持,Chrome 20将会重新支持(貌似之前支持过?)、Safari也即将支持了吧,Opera和Firefox也还都不支持。

以上就是对CSS3新单位有哪些?最新CSS3新单位详解的全部介绍,如果您想了解更多有关CSS3视频教程,请关注PHP中文网。

以上就是CSS3新单位有哪些?最新CSS3新单位详解的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/3120782.html

(0)
上一篇 2025年3月29日 17:25:21
下一篇 2025年3月7日 13:03:13

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • 余承东:享界 S9 增程版预售价 31.8 万起 问界 M8 四月发布

    3 月 20 日,华为举办新品发布会,正式发布了问界 m9 2025 款。与此同时,cnmo 注意到,华为官方还公布了问界 m8 和享界 s9 增程版的更多信息。 问界 M8 余承东宣布,问界 M8 开启预售以来,目前已经收获超过 7 万份…

    2025年3月29日 互联网
    100
  • 问界 M9 和新 M5 Ultra 双车上新,享界 S9 增程版同场发布

    今日下午,华为的发布会上,鸿蒙智行旗下问界和享界品牌带来了新车型,一起来看看。 问界 M9 新车尺寸和外观设计方面此次并未做出调整。 新车带来了新配色,以中式建筑金顶赤宇为灵感,使用 6 涂层双色工艺,经过 130+ 涂装工序,带来更好观感…

    2025年3月29日 互联网
    100
  • 享界 S9 增程版预售 31.8 万起 新时代的豪华被重新定义

    bba”56e” 躺赢的时代,或许很快就要到头了。3 月 20 日举行的华为 pura 先锋盛典及鸿蒙智行新品发布会上,m9 同款科技打满的享界 s9 增程版压轴登场,开启预售,预售价 31.8 万元起,即刻预订享 …

    2025年3月29日 互联网
    100
  • CSS3基本选择器详解_html/css_WEB-ITnose

    css的选择器,我想大家并不会陌生吧,因为天天在使用,但对于css3的选择器,要运用的灵活到位,我想对很多朋友还是一定的难度,特别是css3中的:nth选择器。那么从现在开始我们先丢开他们版本的区别,从头一起来看看css选择器的运用。 CS…

    编程技术 2025年3月28日
    100
  • CSS3属性选择器详解 及 双色球实战开发_html/css_WEB-ITnose

    在前面的章节中,我们了解了,可以使用行内样式,id选择器,类选择器,以及标签选择器来给一个元素应用样式。 如果我们想给定义了那些都定义了某一个属性的元素应用样式,这个时候我们该怎么做呢? 这一节中,我将使用 双色球案例 和 文档类型提示图标…

    编程技术 2025年3月28日
    100
  • 【div+css网页布局详解】_html/css_WEB-ITnose

    前言:网页布局是制作一个网页的第一步也是最重要的一步,今天来详细谈一下使用div+css布局的方法。用dw编写网页的时候是可以通过两种方法的,一是图形界面,二是代码,初学的话可以用图形界面,学的差不多的时候使用代码更能提高效率。 因为现在c…

    编程技术 2025年3月28日
    100
  • html中meta标签及用法详解

    元素可提供有关页面的元信息(meta-information),比如针对搜索引擎和更新频度的描述和关键词。本文主要给大家介绍了html中meta标签及用法详解,感兴趣的朋友一起看看吧,希望能帮助到大家。 Html中meta标签 一、meta…

    编程技术 2025年3月28日
    100
  • js || &&详解

    这次给大家带来js || &&详解,使用js || &&详解的注意事项有哪些,下面就是实战案例,一起来看一下。 ||或位符号 a || b 1.当a ,b 均为true时,注意事项 a 2.当 a,b均为fa…

    编程技术 2025年3月28日
    100
  • 详解Vue列表渲染

    这次给大家带来详解vue列表渲染,详解vue列表渲染的注意事项有哪些,下面就是实战案例,一起来看一下。 变异方法 (mutation method),顾名思义,会改变被这些方法调用的原始数组。相比之下,也有非变异 (non-mutating…

    编程技术 2025年3月28日
    100
  • html的盒模型详解

    这次给大家带来html的盒模型详解,使用html盒模型的注意事项有哪些,下面就是实战案例,一起来看一下。 1.1. 盒的内容区的尺寸— content width和content height —取决于几个因素: –生成该盒的元…

    编程技术 2025年3月28日
    100

发表回复

登录后才能评论