css3之使用選擇器在頁面中插入內容

2021-07-23 01:24:20 字數 607 閱讀 5659

1、使用選擇器插入文字內容

在css3中,使用before選擇器在元素前面插入內容,使用after在元素後面插入內容,在選擇器content屬性中定義要插入的內容。

例如對h2使用before選擇器在h2的前面插入文字「title」等。

還可以使用content屬性追加乙個none屬性值來排除一些不需要插入內容的元素。

如:例如:

2、使用選擇器插入檔案

使用before或者after除了可以在元素前後插入文字之外還可以插入。

在插入是需要使用url指定的路徑,比如在標題前插入一張!

如:例如:

效果;

3、使用選擇器

插入專案編號

還可以使用content屬性的open-quote屬性值與close-quote屬性值在字串的兩邊新增諸如小括號、單引號、雙引號之類的文字字元。如

css3 選擇器 CSS3選擇器

子級選擇器用於選取帶有特定父元素的元素。書寫語法 element1 element2 注意 如果 element2 元素不是父元素 element1 的直接子元素,則不會被選擇。符號之前書寫父級的選擇器,符號之後寫子級選擇器,必須滿足父子級關係才選中標籤 相鄰兄弟選擇器可以用於選擇緊接在另乙個元素後...

css3之選擇器

這些選擇器還是比較簡單的,就不再此一一舉例樣式了.還有隨著各種瀏覽器的公升級,也不在此討論各種版本的瀏覽器對於屬性樣式的相容和支援問題久了.一 屬性選擇器 attr val 屬性attr是val attr val 屬性attr中包含val attr val 屬性attr中開頭是val attr va...

css3 選擇器 CSS3選擇器詳解

css3在css2基礎上,增強或新增了許多特性,彌補了css2的眾多不足之處,使得web開發變得更為高效和便捷。比如說,同樣是乙個頭像,可能在低版本的瀏覽器中,頭像方的 在高版本的瀏覽器中,頭像是圓的。漸進增強和優雅降級之間的不同 面試題目 由於css3普遍存在相容性問題,為了避免因相容性帶來的干擾...