Shulou(Shulou.com)06/01 Report--

This article mainly explains the "css3 how to insert content in the page", the article explains the content is simple and clear, easy to learn and understand, the following please follow the editor's ideas slowly in depth, together to study and learn "css3 how to insert content in the page" bar!

A. use a selector to insert content

H3:before {

Content: "prefix"

}

H3:after {

Content: "suffix"

}

B. specify that individual elements are not inserted

H3.sample:before {

Content:none

}

two。 Insert Ima

A. insert an image file before the title

H3:before {

Content:url (anwy.jpg)

}

B. display the value of the alt attribute as the title of the image (not needed)

Img:after {

Content:attr (alt)

Display:block

Text-align:center

Margin-top:5px

Font-size:11px

Font-weight:bold

Color:black

}

3. Insert number

A. add consecutive numbering before multiple headings

Div:before {

Content:counter (divCounter)

}

Div {

Counter-increment:divCounter

}

B. append text to bullets

Div:before {

Content: "paragraph" counter (divCounter) "

}

C. specify numbering style, category

Div:before {

Content:counter (divCounter,upper-alpha)'.

Color:blue

Font-size:16px

}

D. numbering nesting

Div:before {

Content:counter (divCounter,upper-alpha)'.

Color:blue

Font-size:16px

}

Div {

Counter-increment:divCounter

Counter-reset:subDivCounter

}

P:before {

Content:counter (subDivCounter)'.

Margin-left:15px

Font-size:12px

}

P {

Counter-increment:subDivCounter

}

E. add text nested symbols on both sides of the string

H4:before {

Content: open-quote

}

H4:after {

Content: close-quote

}

H4 {

Quotes: "["] "

}

Disc point | circle circle | square square | decimal number | decimal-leading-zero decimal number | lower-roman lowercase Roman | upper-roman uppercase Roman | lower-greek lowercase Greek letter | lower-latin lowercase Latin | upper-latin uppercase Latin | armenian Armenian numeral | georgian Georgia numeral | lower-alpha lowercase letter | upper-alpha uppercase letter | none none | inherit inheritance

Thank you for your reading, the above is the content of "css3 how to insert content in the page", after the study of this article, I believe you have a deeper understanding of how css3 inserts content in the page, and the specific use needs to be verified in practice. Here is, the editor will push for you more related knowledge points of the article, welcome to follow!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.