CSS3新属性

1、CSS3边框

border-radius:圆角边框
border-shadow:边框阴影
border-image:边框图片

2、CSS3背景

background-size:属性规定背景图片的尺寸。
background-origin:属性规定背景图片的定位区域。

3、CSS3文字效果

text-shadow:文本阴影。
word-wrap:对长单词进行拆分,并换到下一行

4、CSS3 2D转换

transform:对元素进行移动、缩放、转动、拉伸
translate(x,y):元素从当前位置移动,根据给定的left(x)和top(y)未知参数
rotate():元素顺时针旋转给定的角度。允许负值,元素逆时针旋转。
scale(x,y):元素的尺寸会根据参数增加或减少,xy是基于本来元素的倍数。
skew(x,y):元素转动给定的角度。

6、CSS3 过渡

transition 简写属性,用于在一个属性中设置四个过渡属性。
transition-property 规定应用过渡的 CSS 属性的名称。
transition-duration 定义过渡效果花费的时间。默认是 0。
transition-timing-function 规定过渡效果的时间曲线。默认是 “ease”。
transition-delay 规定过渡效果何时开始。默认是 0。

7、CSS3 动画

animation 所有动画属性的简写属性,除了 animation-play-state 属性。
animation-name 规定动画的名称。
animation-duration 规定动画完成一个周期所花费的秒或毫秒。默认是 0。
animation-timing-function 规定动画的速度曲线。默认是 “ease”。
animation-delay 规定动画何时开始。默认是 0。
animation-iteration-count 规定动画被播放的次数。默认是 1。
animation-direction 规定动画是否在下一周期逆向地播放。默认是 “normal”。
animation-play-state 规定动画是否正在运行或暂停。默认是 “running”。

猜你喜欢

转载自blog.csdn.net/weixin_40589472/article/details/85060959