CSS(Cascading Style Sheets)即層疊樣式表,是用于指定HTML、XML或SVG文檔的樣式的一種樣式語言。CSS使創建令人愉悅的網頁布局和視覺外觀變得更容易,包括頁面布局、字體、顏色、背景、邊框、間距、邊距等方面。
CSS使用選擇器來為不同的HTML元素應用不同的樣式。選擇器可以根據標記名稱、類、ID、屬性、狀態等來選擇元素。例如:
p { color: blue; font-size: 16px; } #header { background-color: grey; height: 100px; width: 100%; } .btn:hover { background-color: blue; color: white; }
上面的代碼段展示了CSS的基本語法和一些常用的選擇器。第一個選擇器是選擇所有的段落元素(使用p標簽)。它設置了藍色字體和16像素大小的字體。第二個選擇器選擇ID為“header”的元素,設置為灰色背景,高度為100像素,寬度為100%。第三個選擇器選擇所有具有類名“btn”的元素,當鼠標滑過時設置背景顏色為藍色,字體為白色。
CSS還支持繼承和層疊,這使得樣式更容易管理,同時提供了更強大的樣式功能。例如:
.parent { color: blue; } .child { font-size: 14px; } .child:hover { font-weight: bold; }
在上面的代碼示例中,元素child被定義為它的父元素parent的子元素。因此,child會繼承parent的顏色為藍色。child還定義了一個單獨的樣式,設置字體大小為14像素。當鼠標滑過child元素時,字體加粗。
總而言之,CSS是一種強大的前端語言,它使得網站布局和設計更美觀、易于維護。通過選擇器、繼承和層疊等功能,開發人員可以輕松地控制元素的外觀,為用戶提供更好的瀏覽體驗。