在 CSS 中,選擇器用于定位并改變網頁中的元素樣式。選擇器通常根據元素的樣式類、ID 或元素類型進行選擇。下面介紹 CSS 常用的基礎選擇器:
/* 基于元素類型的選擇器 */ p { color: red; } /* 基于類名的選擇器 */ .title { font-size: 24px; } /* 基于 ID 的選擇器 */ #logo { width: 200px; } /* 基于屬性的選擇器 */ input[type="text"] { border: 1px solid #ccc; } /* 基于后代元素的選擇器 */ ul li { list-style: none; } /* 基于子元素的選擇器 */ ul >li { padding: 10px; }
基于元素類型的選擇器,例如上述 p 選擇器,會選取網頁中所有的 p 元素并應用相應的樣式。基于類名的選擇器,例如上述 .title 選擇器,會選取所有帶有 title 類名的元素來應用樣式。基于 ID 的選擇器,例如上述 #logo 選擇器,選取具有 logo ID 的元素來應用樣式。
基于屬性的選擇器,例如上述 input[type="text"] 選擇器,選取 type 屬性值為 text 的元素來應用樣式。基于后代元素的選擇器,例如上述 ul li 選擇器,會選取 ul 元素內所有 li 元素來應用樣式。基于子元素的選擇器,例如上述 ul >li 選擇器,會選取 ul 元素下一級的 li 元素來應用樣式。
以上是 CSS 中常用的基礎選擇器,了解它們對編寫高效的 CSS 代碼很有幫助。
下一篇css常用樣式有哪兩種