[分享]css3所包含的属性

CSS3是CSS的升级版本，它包含了许多新的属性，使得页面的样式更加丰富多彩。下面介绍一些常用的CSS3属性：

.box {
  border-radius: 10px; /* 边框圆角 */
  box-shadow: 2px 2px 4px #999; /* 阴影效果 */
  text-shadow: 1px 1px 1px #999; /* 文字阴影 */
  background: linear-gradient(to bottom, #fff, #ccc); /* 渐变背景色 */
  font-size: 2em; /* 字体大小 */
}

.box:hover {
  transition: all 0.3s ease-in-out; /* 过渡效果 */
  transform: rotate(20deg); /* 旋转 */
  opacity: 0.8; /* 透明度 */
  filter: grayscale(50%) blur(3px); /* 滤镜效果 */
}

另外，CSS3还有一些新的选择器，能够更精细地选取元素，如：

p:first-of-type { /* 选取同级别的第一个p元素 */
  font-weight: bold;
}

p:nth-child(2n) { /* 选取同级别的偶数个p元素 */
  color: blue;
}

div[attr*=value] { /* 选取属性中包含value的div元素 */
  background: #f00;
}

总的来说，CSS3带来了很多新功能，可以让我们更加灵活和方便地控制页面的样式，提高用户体验。