CSS3新增样式

CSS3是CSS（层叠样式表）的一个版本，引入了许多新特性，包括选择器、背景和边框的新属性、文字效果、过渡和动画等。以下是一些CSS3的新增样式示例：

1. 圆角（border-radius）：

div {
  border: 2px solid #a1a1a1;
  border-radius: 25px; /* 圆角的半径 */
}

2. 阴影（box-shadow）：

div {
  box-shadow: 10px 10px 5px #888888; /* 水平偏移 垂直偏移 模糊半径 颜色 */
}

3. 渐变（gradient）：

div {
  background: linear-gradient(to right, red , yellow); /* 线性渐变 */
}

4. 转换（transform）：

div:hover {
  transform: rotate(360deg); /* 旋转 */
}

5. 动画（animation）：

@keyframes myAnimation {
  from {background-color: red;}
  to {background-color: yellow;}
}
 
div {
  animation-name: myAnimation;
  animation-duration: 4s; /* 动画时长 */
  animation-iteration-count: infinite; /* 动画重复次数 */
}

6. 伪元素（::before, ::after）：

div::before {
  content: "";
  display: block;
  width: 50px;
  height: 50px;
  background-color: blue;
}

这些只是CSS3功能的一小部分，还有许多其他的特性，如自定义动画、变换、过渡、媒体查询等。CSS3为网页设计提供了更多样化和动感的效果。