CSS 的历史 CSS2 CSS3的差别

相比CSS2,CSS3新增加了许多属性。

下面是 CSS3 新增的 CSS3 属性列表。

animation (and eight associated longhand properties)、

background-clip、

background-origin、

background-size、

border-radius (and four associated longhand properties)

border-image (and six associated longhand properties)、

box-decoration-break、

box-shadow、

box-sizing、

columns (and thirteen associated multi-column properties)

clear-after、

flex (and eleven associated flexbox properties)、

font-stretch、

font-size-adjust、

font-synthesis、

font-kerning、

font-variant-caps、

hanging-punctuation hyphens、

icon、

image-resolution、

image-orientation、

line-break、

object-fit、

object-position、

opacity、

outline-offset、

overflow-wrap / word-wrap、

backface-visibility

perspective、

perspective-origin、

pointer-events (for HTML)、

resize、

tab-size、

text-align-last、

text-decoration-line、

text-decoration-skip、

text-decoration-position

text-decoration-style、

text-emphasis (and three associated properties)、

text-justify、

text-orientation、

text-overflow、

transform、

transform-style、

text-shadow

transition (and four associated longhand properties)、

word-break、

word-spacing、

writing-mode

时间: 2024-11-03 05:52:55

CSS 的历史 CSS2 CSS3的差别的相关文章

CSS圆角效果 -webkit-border-radius(CSS3中border-radius隐藏的威力)

CSS圆角效果 -webkit-border-radius(CSS3中border-radius隐藏的威力) 来源:互联网 作者:佚名 时间:03-28 14:17:14 [大 中 小] border-radius:用这个属性能实现圆角边框的效果.现在只有Mozilla/Firefox 和 Safari 3支持该属性. -webkit-border-radius:苹果:谷歌,等一些浏览器认,因为他们都用的是webkit内核: -moz-border-radius:moz这个属性 主要是专门支持M

【二次元的CSS】—— 用 DIV + CSS3 画咸蛋超人(详解步骤)

[二次元的CSS]—— 用 DIV + CSS3 画咸蛋超人(详解步骤) 2016-05-17 HTML5cn 仅仅使用div作为身体的布局,用css3的各种transform和圆角属性来绘制各部位的形状,当然也不会使用任何图片哦.那就没意思了. 有的同学说,用canvas不是能画得更逼真而且更简单吗?这点我也非常赞同,但我的理由还是,那就没意思了. 这次写的详细一点,把各个部位都拆出来分析. 第一步:头部轮廓 <header></header> .ultraman header

css雪碧(CSS Sprite)和css3过渡效果综合应用

在网页中我们经常可以看到,有些图片在鼠标经过的时候,有一个上下或左右的滑动效果,很实用页很方便,今天正好用到,拿来和大家分享一下,有什么不对或意见欢迎指正. html部分如下,这里本来打算用jq来着,后来没有用到.. 话不多说直接上代码.. <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>css雪碧(CSS Sprite)和css3过渡效果综合应用</

css 历史及css3 新特性

CSS盒子模型之CSS3可伸缩框属性(Flexible Box)

CSS盒子模型(下) 一.CSS3可伸缩框(Flexible Box) 可伸缩框属性(Flexible Box)是css3新添加的盒子模型属性,有人称之为弹性盒模型,它的出现打破了我们经常使用的浮动布局,实现垂直等高.水平均分.按比例划分等分布方式以及如何处理可用的空间.使该模型,可以很轻松的创建自适应浏览器窗口的流动布局或自适应字体大小的弹性布局.但是它有一定的局限性,在firefox.chrome这浏览器下需要使用它们的私有属性来定义:firefox(-moz).chrome(-webkit

NB的CSS样式集锦1——CSS3滚动条美化,CSS3滚动条皮肤

转自:http://www.pengyaou.com/codecss3/POKDNMS_112.html CSS3 -webkit-scrollbar滚动条皮肤美化实现,利用-webkit-scrollbar,-webkit-scrollbar-track,-webkit-scrollbar-thumb这2个属性设置不同样式的滚动条. 下面是5个滚动条样式. css代码 1 .test1::-webkit-scrollbar { 2 width: 8px; 3 } 4 .test1::-webk

CSS的单位及css3的calc()及line-height百分比

锚点:css中百分比减去固定元素 单位介绍 说到css的单位,大家应该首先想到的是px,也就是像素,我们在网页布局中一般都是用px,但是近年来自适应网页布局越来越多,em和百分比也经常用到了.然后随着手机的流行,web app和hybrid app的开发,都用到了css3技术,在css3中,新增了许多单位,rem.vw和vh.vmin和vmax.ch和ex等等,那现在对这些单位分别做一下详细的介绍吧. em 做前端的应该对em不陌生,不是什么罕见的单位,是相对单位,参考物是父元素的font-si

animate.css 一些常用的CSS3动画效果

大家已经开始在项目中使用一些CSS3动画效果了吧,这让网站在高端浏览器上看起来很上流.animate.css是一个老外做的各种CSS3动画的合集,比较全,也很炫,大家可以参考学习一下. 项目主页:http://daneden.me/animate/ 自定义下载样式:http://daneden.me/animate/build/ git地址:https://github.com/daneden/animate.css

(13/24) css进阶:自动处理css3属性前缀

什么是属性前缀 为了浏览器的兼容性,有时候我们必须加入-webkit,-ms,-o,-moz这些前缀.目的就是让我们写的页面在每个浏览器中都可以顺利运行. 例如: transition: width 2s; -moz-transition: width 2s; /* Firefox 4 */ -webkit-transition: width 2s; /* Safari 和 Chrome */ -o-transition: width 2s; /* Opera */ 使用插件来帮助我们进行前缀的