在CSS中,::after
和::before
是偽元素,用于在元素的內(nèi)容前后插入內(nèi)容或樣式,它們通常與content
屬性一起使用。
::before
偽元素在元素的內(nèi)容之前插入內(nèi)容或樣式,如果您想在每個段落之前添加一個裝飾性的引言,您可以使用::before
偽元素來實現(xiàn),以下是一個示例:
p::before { content: "引言: "; color: blue; }
在這個示例中,每個段落之前都會顯示一個藍色的引言。
::after
偽元素與::before
相反,它在元素的內(nèi)容之后插入內(nèi)容或樣式,如果您想在每個段落之后添加一個裝飾性的結(jié)語,您可以使用::after
偽元素來實現(xiàn),以下是一個示例:
p::after { content: " "; color: red; }
在這個示例中,每個段落之后都會顯示一個紅色的結(jié)語。
::before
和::after
偽元素只能插入到塊級元素中,因為它們需要空間來顯示內(nèi)容,如果您嘗試將它們插入到內(nèi)聯(lián)元素中,它們將不會起作用。
::before
和::after
偽元素的內(nèi)容可以是文本、圖像或其他類型的媒體,您可以根據(jù)需要自定義它們的內(nèi)容。