CSS3是一種新一代的CSS標準,它引入了許多新特性和功能,讓開發者能夠更加輕松地創建出漂亮和現代化的網站布局。以下是CSS3新增的部分內容:
/* 圓角 */
.box {
border-radius: 10px;
}
/* 陰影 */
.box {
box-shadow: 5px 5px 5px #888;
}
/* 漸變背景 */
.box {
background: linear-gradient(to bottom, #fff, #000);
}
/* 文字陰影 */
h1 {
text-shadow: 1px 1px 1px #888;
}
/* 2D變換 */
.box {
transform: rotate(45deg);
}
/* 過渡 */
.box {
transition: width 1s ease;
}
圓角:border-radius屬性可以給一個元素的邊界添加圓角,可以使頁面看起來更加柔和和美觀。
陰影:box-shadow屬性可以給一個元素添加陰影效果,可以使頁面元素看起來更立體和具有層次感。
漸變背景:background屬性加上linear-gradient可以實現線性漸變背景色,制作出更加美觀的頁面背景。
文字陰影:text-shadow屬性可以給頁面中的文字添加陰影效果,制作出更加具有立體感的文字效果。
2D變換:transform屬性可以使一個元素產生旋轉、位移和縮放等變換效果,制作出更加生動的頁面動畫效果。
過渡:transition屬性可以幫助開發者實現頁面元素的平滑過渡效果,讓頁面更加自然和流暢。
上一篇css3 數字遞增