美文网首页
CSS3介绍

CSS3介绍

作者: LorenSLJ | 来源:发表于2018-11-01 21:08 被阅读0次

CSS3 完全向后兼容,因此您不必改变现有的设计。浏览器通常支持 CSS2。

CSS3 模块

CSS3 被划分为模块。其中最重要的 CSS3 模块包括:
  选择器
  框模型
  背景和边框
  文本效果
  2D/3D 转换
  动画
  多列布局
  用户界面

CSS3 标准

W3C 仍然在对 CSS3 规范进行开发。不过,现代浏览器已经实现了相当多的 CSS3 属性。

浏览器引擎前缀(Vendor Prefix)是什么?

Vendor prefix—浏览器引擎前缀,是一些放在CSS属性前的小字符串,用来确保这种属性只在特定的浏览器渲染引擎下才能识别和生效。谷歌浏览器和Safari浏览器使用的是WebKit渲染引擎,火狐浏览器使用的是Gecko引擎,Internet Explorer使用的是Trident引擎,Opera以前使用Presto引擎,后改为WebKit引擎。一种浏览器引擎里一般不实现其它引擎前缀标识的CSS属性,但由于以WebKit为引擎的移动浏览器相当流行,火狐等浏览器在其移动版里也实现了部分WebKit引擎前缀的CSS属性。

浏览器引擎前缀(Vendor Prefix)有哪些?

前缀 浏览器
-webkit- Safari, 谷歌浏览器等使用Webkit引擎的浏览器
-moz- 火狐等使用Mozilla浏览器引擎的浏览器
-ms- Internet Explorer (不一定)
-o- Opera浏览器(早期)

为什么需要浏览器引擎前缀(Vendor Prefix)?

这些浏览器引擎前缀(Vendor Prefix)主要是各种浏览器用来试验或测试新出现的CSS3属性特征。可以总结为以下3点:

  试验一些还未成为标准的的CSS属性——也许永远不会成为标准
  对新出现的标准的CSS3属性特征做实验性的实现
  对CSS3中一些新属性做等效语义的个性实现

这些前缀并非所有都是需要的,但通常你加上这些前缀不会有任何害处——只要记住一条,把不带前缀的版本放到最后一行:

-moz-border-radius: 10px; 
-webkit-border-radius: 10px; 
-o-border-radius: 10px; 
border-radius: 10px; 

相关文章

  • CSS 响应设计-媒体查询

    1、响应式 Web 设计 - 媒体查询 媒体(media)查询在 CSS3 上有介绍:CSS3 @media 查询...

  • 10分钟理解CSS3 Grid布局

    基本介绍 上一篇文章我们介绍了css3 flexbox,今天我们再来说说css3的另外一个强大的功能:Grid。 ...

  • CSS3

    CSS3 CSS3介绍 如同人类的的进化一样,CSS3是CSS2的“进化”版本,在CSS2基础上,增强或新增了许多...

  • 原生开发移动web单页面(step by step)7——页面切

    在开始写页面切换效果前,首先要介绍一下css3的animation模块,在css中定义如下 css3的animat...

  • html5/css3响应式布局介绍及设计流程

    html5/css3响应式布局介绍及设计流程,利用css3的media query媒体查询功能。移动终端一般都是对...

  • CSS3 transition介绍

    转自:https://www.jianshu.com/p/56f8ddafc63f上一篇介绍了CSS3里trans...

  • CSS3 transform介绍

    CSS里transform变形这个属性有点学习难度,尤其在CSS3里加上了3D效果之后,2维变3维学习成本更是成倍...

  • css3简要介绍

    1.1可用性其次 当用户访问你网站中的内容和服务的时候,他们能理解并且找到他们想要的信息吗? 这是个简单甚至...

  • CSS3 transform介绍

    CSS里transform变形这个属性有点学习难度,尤其在CSS3里加上了3D效果之后,2维变3维学习成本更是成倍...

  • CSS3 background介绍

    background应该是CSS里使用频率颇高的属性,简单实用。但参数偏多,本篇就介绍一下background的各...

网友评论

      本文标题:CSS3介绍

      本文链接:https://www.haomeiwen.com/subject/afrfxqtx.html