CSS3是層疊樣式表的最新版本,它增加了很多新的屬性和選擇器來幫助我們創建更好的頁面。在此,我們將討論一些新添加的CSS3屬性。
首先,我們介紹一下border-radius屬性。它可以將元素的邊角變得圓角,而不是直角。示例如下:
border-radius: 10px;
接下來,我們看一看box-shadow屬性,它可以給元素添加陰影效果,示例如下:
box-shadow: 2px 2px 10px #888888;
然后,我們來介紹transform屬性,它可以讓元素進行旋轉、縮放和扭曲等特效,示例如下:
transform: rotate(45deg); transform: scale(2); transform: skew(10deg);
接下來一個屬性是transition,它可以讓元素在某些事件觸發時進行過渡/動畫效果。示例如下:
transition: width 2s; transition: all 0.5s ease;
最后一個屬性是animation,它可以讓元素帶有復雜的動畫效果,示例如下:
animation: fadeinout 2s infinite; @keyframes fadeinout { 0% {opacity: 0;} 50% {opacity: 1;} 100% {opacity: 0;} }
以上就是CSS3新增加的一些屬性,它們可以讓我們更加簡單地創建出美觀且豐富的頁面效果。
下一篇css3怎么加視頻