CSS3 是 CSS 技術的最新升級版,新增了很多新特征,讓我們的網頁變得更加美觀和動態。下面我們來介紹幾個主要的新特征。
1、CSS3 選擇器
/* 選擇ID為myid的元素 */ #myid { font-size: 18px; } /* 選擇class為myclass的元素 */ .myclass { color: red; } /* 選擇所有的p元素 */ p { line-height: 1.5; }
2、CSS3 盒模型
/* 設置一個有圓角的盒子 */ .box { width: 200px; height: 200px; background: #efefef; border-radius: 10px; box-shadow: 2px 2px 4px rgba(0,0,0,0.3); }
3、CSS3 過渡效果
/* 鼠標懸停時逐漸改變顏色 */ .button { background: #7ed6ff; transition: background 0.5s ease-in-out; } .button:hover { background: #ff5860; }
4、CSS3 動畫效果
/* 旋轉動畫 */ .rotate { animation: rotate 2s linear infinite; } @keyframes rotate { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
總之,CSS3 是一個強大的工具,可以讓我們的網頁變得更加豐富多彩。通過運用上述的特性,我們可以創造出更加炫酷和優美的網頁效果。
上一篇css3 樣式嵌套
下一篇php apcu 安裝