CSS3是Cascading Style Sheets语言的最新版本,它包含了许多新特性和新属性,这篇文章将介绍一些CSS3新增的属性。
/* 新增属性1: border-radius */ border-radius: 10px; /* 使一个元素的边框呈现圆角 */ /* 新增属性2: box-shadow */ box-shadow: 10px 10px 5px grey; /* 在一个元素周围添加阴影 */ /* 新增属性3: text-shadow */ text-shadow: 2px 2px black; /* 在文本周围添加阴影 */ /* 新增属性4: opacity */ opacity: 0.5; /* 控制一个元素的透明度,0表示完全透明,1表示完全不透明 */ /* 新增属性5: gradient */ background: linear-gradient(red, yellow); /* 创建一个渐变背景,从左上角到右下角 */ /* 新增属性6: border-image */ border-image: url(border.png) 20 20 round; /* 用图片作为边框样式,可以控制图片的位置、大小和圆角 */ /* 新增属性7: transform */ transform: rotate(30deg); /* 旋转一个元素,可以控制旋转角度 */ /* 新增属性8: transition */ transition: all 1s; /* 控制CSS属性从一个状态到另一个状态的过渡效果,可以控制过渡时间和效果 */
以上这些CSS3新增的属性可以帮助我们更轻松地实现一些效果,在美化页面的同时也提高了用户体验。