CSS3是最新的CSS標準,它引入了許多新特性和標簽,使網頁設計更加靈活和優雅。
/* border-radius用于設置圓角 */ div { border-radius: 10px; } /* box-shadow用于設置陰影 */ div { box-shadow: 5px 5px 5px #888888; } /* text-shadow用于設置文字陰影 */ h1 { text-shadow: 2px 2px 2px #888888; } /* opacity用于設置透明度 */ div { opacity: 0.5; }
其中,border-radius用于設置圓角,可以讓按鈕、圖片等元素變得更加圓潤。box-shadow用于設置陰影,能夠增加元素的立體感。text-shadow可以給文字添加陰影效果,讓文字更加突出。opacity用于設置元素的透明度,可以讓頁面更加美觀。
除此之外,CSS3還引入了一些新標簽,例如:
/* transform用于旋轉、縮放和傾斜元素 */ div { transform: rotate(30deg); } /* transition用于設置過渡效果 */ div { transition: width 2s; } /* animation用于設置動畫效果 */ div { animation: move 2s infinite; }
transform用于旋轉、縮放和傾斜元素,可以讓頁面動態起來。transition用于設置過渡效果,能夠讓頁面過渡更加平滑自然。animation用于設置動畫效果,可以創建出炫酷的頁面效果。
總之,CSS3的新特性和標簽為網頁設計帶來了更多的可能性,也增加了網頁設計的樂趣。
上一篇css3文字逐字變色
下一篇css3文本模型教學