在CSS中,選擇器可以讓我們針對指定的HTML元素應用樣式。而基本選擇器是指最常用的幾種選擇器,比如元素選擇器、ID選擇器和類選擇器等。然而,在這些基本選擇器外,還有一些其它的選擇器,它們并不屬于CSS的基本選擇器,下面就來詳細介紹一下這些選擇器。
/* CSS代碼 */ /* 子串匹配屬性選擇器 */ [attribute^=value] /* 選擇attribute屬性值以value開頭的元素 */ [attribute$=value] /* 選擇attribute屬性值以value結尾的元素 */ [attribute*=value] /* 選擇attribute屬性值包含value的元素 */
子串匹配屬性選擇器是指在選擇屬性時,不僅僅只選擇它的值,還可以針對這個值的特定部分進行選擇。例如,上面的代碼就是通過選擇元素的attribute屬性值的開頭、結尾或者包含指定字符來選中元素。
/* CSS代碼 */ :not(selector) /* 選中除了給定選擇器匹配的元素之外的所有元素 */
這個選擇器是指不選中與指定選擇器匹配的元素,而是選中這個選擇器所不匹配的元素。例如,如果要選中除了一個類名為"example"的元素以外的所有元素,可以使用:not(.example)來實現。
/* CSS代碼 */ ::first-letter /* 選擇元素的第一個字母的樣式 */ ::first-line /* 選擇元素的第一行的樣式 */ ::before /* 選擇元素之前的內容 */ ::after /* 選擇元素之后的內容 */
這些選擇器都是偽元素選擇器,它們不是以元素為選擇目標,而是以元素的某些部分為選擇目標。例如,::first-letter可以讓我們選擇元素的第一個字母應用樣式,::before和::after可以為元素添加額外的內容。
總之,盡管這些選擇器不屬于CSS的基本選擇器,但是它們在某些情況下可以為我們提供非常有用的選擇操作。所以,當我們需要更細粒度的元素選擇時,不妨嘗試一下這些選擇器。
上一篇不學html直接學css
下一篇不影響樣式的css屬性