CSS3是指Cascading Style Sheets Level 3,是對CSS的最新版本進行改進和完善。在這個版本中,新增了許多新的屬性,讓我們來一一介紹一下:
/* border-radius屬性可以設置邊框四個角的圓角半徑 */ div { border-radius: 10px; } /* box-shadow屬性可以為元素添加陰影 */ div { box-shadow: 5px 5px 5px grey; } /* text-shadow屬性可以為文本添加陰影 */ p { text-shadow: 2px 2px 2px grey; } /* transform屬性可以對元素進行旋轉、縮放、傾斜等變換 */ div { transform: rotate(45deg) scale(1.5) skew(10deg); } /* transition屬性可以讓元素的某些屬性平滑地過渡 */ div { transition: width 1s; } /* animation屬性可以讓元素進行動畫效果 */ div { animation: spin 2s infinite; } /* @media查詢可以根據設備屏幕大小來應用不同的樣式 */ @media screen and (max-width: 600px) { div { width: 100%; } }
以上是一些CSS3的新增屬性,它們可以讓我們更好地控制樣式,提升網頁的交互效果。但是需要注意的是,有些屬性不兼容老版本的瀏覽器,需要考慮使用polyfill或者fallback技術解決。
下一篇下面哪個css屬性