CSS3（层叠样式表第三版）是CSS技术的一个重大更新，它引入了许多新特性和模块，旨在提高网页设计的灵活性、表现力和响应性。以下是CSS3 的一些关键新特性：
1. 选择器的扩展
- 属性选择器：可以更精确地根据元素属性和属性值进行选择。
-
结构伪类选择器：如
:nth-child、:nth-of-type、:first-of-type等，提供了更多样的选择器。 -
伪元素：如
::first-line和::before/::after，允许开发者对元素的特定部分进行样式化。
2. 颜色和渐变
- RGBA和HSLA颜色模式：提供了更丰富的颜色表示方式，包括透明度（alpha）的支持。
- 渐变：CSS3 允许创建线性渐变和径向渐变，为背景和其他元素提供了丰富的视觉效果。
3. 背景和边框
-
背景图片大小：可以指定背景图片的大小，包括
cover和contain。 -
边框圆角：
border-radius属性允许创建圆角边框。 -
边框图片：
border-image属性可以用图片作为边框。 -
阴影：
box-shadow和text-shadow属性为元素添加阴影效果。
4. 盒模型和布局
-
盒阴影：
box-shadow属性为盒模型添加阴影效果。 - 弹性盒布局（Flexbox）：提供了一种新的布局方式，使得元素可以灵活地伸缩和对齐。
- 网格布局（CSS Grid）：引入了一种强大的二维布局系统，可以创建复杂的网页布局。
5. 文本和字体
-
文本阴影：
text-shadow属性为文本添加阴影效果。 -
Web字体：
@font-face规则允许在网页上使用自定义字体。 -
文本溢出：
text-overflow属性处理文本溢出的情况，如显示省略号。
6. 动画和过渡
-
CSS动画：通过
@keyframes和animation属性，可以创建复杂的动画效果。 -
CSS过渡：
transition属性允许在一定时间内平滑地改变属性值，提供更好的用户体验。
7. 变形和转换
-
2D 和 3D 转换：
transform属性允许对元素进行平移、旋转、缩放和倾斜等操作。 -
透视：
perspective属性为3D元素提供透视效果。
8. 媒体查询和响应式设计
- 媒体查询：CSS3 的媒体查询使得开发者可以根据设备的特性（如屏幕宽度、分辨率）来应用不同的样式规则。
-
响应式单位：如
vw（视口宽度单位）、vh（视口高度单位）等，支持更精确的响应式布局。
9. 其他特性
- 跨媒体查询：CSS3 的媒体查询不仅限于屏幕，还可以应用于打印和其他媒体类型。
- 自定义属性（CSS变量）：允许在 CSS 中定义可重用的值，提高了样式的可维护性。
-
媒体类型：如
print、speech等，为不同的输出设备提供样式。
CSS3 的这些新特性极大地扩展了网页设计的边界，使得开发者能够创建更加丰富、动态和吸引人的网页界面。随着浏览器对 CSS3 的支持越来越好，这些特性已经成为现代网页设计的标准工具。