CSS3学习总结----W3school
作者：互联网
1：CSS3 边框
border-image 边框图片。
border-radius 圆角边框。
box-shadow 边框阴影。
2：CSS3 背景
background-clip 规定背景的绘制区域。
background-origin 规定背景图片的定位区域
背景图片可以放置于 content-box、padding-box 或 border-box 区域。
background-size 规定背景图片的尺寸。
3：CSS3 文本效果
text-shadow 文本阴影。
word-wrap 允许对长的不可分割的单词进行分割并换到下一行。
4：CSS3 字体
您“自己的”的字体是在 CSS3 @font-face 规则中定义的。
在新的 @font-face 规则中，您必须首先定义字体的名称（比如 myFirstFont），然后指向该字体文件。如需为 HTML 元素使用字体，请通过 font-family 属性来引用字体的名称 (myFirstFont)。
5：CSS3 2D 转换
translate() 元素从其当前位置移动，根据给定的 left（x 坐标） 和 top（y 坐标） 位置参数。
rotate() 元素顺时针旋转给定的角度。允许负值，元素将逆时针旋转。
scale() 元素的尺寸会增加或减少，根据给定的宽度（X 轴）和高度（Y 轴）参数。
skew() 元素翻转给定的角度，根据给定的水平线（X 轴）和垂直线（Y 轴）参数。
matrix() 方法把所有 2D 转换方法组合在一起，方法需要六个参数，包含数学函数，允许您：旋转、缩放、移动以及倾斜元素。
6：CSS3 3D 转换
rotateX() 元素围绕其 X 轴以给定的度数进行旋转。
rotateY() 元素围绕其 Y 轴以给定的度数进行旋转。
7：CSS3 过渡
通过 CSS3，我们可以在不使用 Flash 动画或 JavaScript 的情况下，当元素从一种样式变换为另一种样式时为元素添加效果。
8： CSS3 动画
@keyframes 规则用于创建动画。在 @keyframes 中规定某项 CSS 样式，就能创建由当前样式逐渐改为新样式的动画效果。
当您在 @keyframes 中创建动画时，请把它捆绑到某个选择器，否则不会产生动画效果。
通过规定至少以下两项 CSS3 动画属性，即可将动画绑定到选择器：
规定动画的名称
规定动画的时长
9：CSS3 多列 您能够创建多个列来对文本进行布局 - 就像报纸那样！
column-count 规定元素应该被分割的列数。
column-gap 规定列之间的间隔。
column-rule 设置列之间的宽度，样式，颜色规则。
10：CSS3 用户界面 新的用户界面特性包括重设元素尺寸、盒尺寸以及轮廓等。
resize 规定是否可由用户调整元素尺寸。
box-sizing 允许您以确切的方式定义适应某个区域的具体内容。
outline-offset 对轮廓进行偏移，并在超出边框边缘的位置绘制轮廓。
奘倥城
发布了10 篇原创文章 · 获赞 0 · 访问量 194
私信
关注
标签：CSS3,总结,动画,W3school,元素,box,边框,给定 来源： https://blog.csdn.net/weixin_45178761/article/details/103967472