CSS3 中有哪些新特性

Question

CSS3 引入了许多新特性和模块，以下是一些常见的 CSS3 新特性：

1. 选择器增强：

   • 属性选择器：支持更多的属性选择器，如属性值前缀、后缀、包含等。
   • 伪类选择器：引入了新的伪类选择器，如 :nth-child() 、 :nth-of-type() 等。

2. 盒子模型：

   • 边框圆角（border-radius）：可以设置元素的边框圆角。
   • 阴影效果（box-shadow）：可以为元素添加阴影效果。
   • 盒子大小（box-sizing）：可以调整盒子模型的尺寸计算方式。

3. 背景和渐变：

   • 线性渐变（linear-gradient）：可以创建水平或垂直方向的渐变背景。
   • 径向渐变（radial-gradient）：可以创建从一个中心点向外扩散的渐变背景。

4. 文字和字体：

   • @font-face ：允许在网页中引用自定义字体文件。
   • 文字阴影（text-shadow）：可以为文字添加阴影效果。
   • 多列文字（columns）：可以创建多列布局的文字。

5. 过渡和动画：

   • 过渡效果（transition）：可以实现元素在不同状态之间的平滑过渡。
   • 关键帧动画（ @Keyframes ）：可以定义动画的关键帧和动画效果。
   • 动画属性（animation）：用于指定动画的持续时间、重复次数等属性。

6. 弹性布局（Flexbox）：

   • 引入了弹性布局模型，使元素在容器中的布局更加灵活和自适应。

7. 响应式布局（Media Queries）：

   • 可以根据不同的媒体查询条件应用不同的样式，实现响应式布局。

8. 变换和变形：

   • 2D 变换（transform）：可以对元素进行平移、旋转、缩放等变换操作。
   • 3D 变换（transform）：可以实现元素的三维空间变换效果。

9. 过滤器（Filter）：

   • 可以应用各种视觉效果和图像处理效果，如模糊、亮度、对比度等。

10. 多列布局（Multicolumn Layout）：

    • 可以将内容分为多列进行布局。

以上只是 CSS3 中的一些常见新特性，还有许多其他的新特性和模块，使得开发者可以更加灵活和高效地进行样式设计和布局。