在網頁設計中,有時候需要讓一段文字重復出現多次,這時候可以使用CSS來實現。
代碼如下: p { background-color: yellow; line-height: 2em; padding: 10px; text-align: center; } p::after { content: "重復出現,"; } p:nth-child(2)::after { content: "再次出現,"; } p:last-child::after { content: "最后出現。"; }
上面的代碼中,我們首先設置了p標簽的樣式,包括背景顏色、行高、內邊距和居中對齊。然后,我們使用偽元素::after來加上需要重復出現的文字,這里我們設置為“重復出現,”,表示第一次出現。
接著,我們使用:nth-child(2)偽類來選擇第二個p標簽,再次使用::after偽元素來加上文字“再次出現,”,表示第二次出現。最后,我們使用:last-child偽類來選擇最后一個p標簽,并再次使用::after偽元素來加上文字“最后出現。”,表示最后一次出現。
這樣,我們就成功地使用CSS讓一段文字重復出現多次了。如果需要更多的重復,只需要按照上面的方式繼續添加即可。
上一篇css讓div里圖片居中
下一篇css讓元素不換行