CSS3 inserting content into a page

A . use selectors to insert content

h2:before{

Content: " prefix ";

}

h2:after{

Content: " suffix ";

}

B . Specifies that individual elements are not inserted

h2.sample:before{

Content:none;

}

2. inserting images

A . Insert an image file before the title

h2:before{

Content:url (anwy.jpg);

}

B . Displays the value of the ALT attribute as the caption of the image (not available)

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: " section" of "Counter (divcounter )";

}

C . Specify numbering style, kind

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 nesting symbols on both sides of the string

h3:before{

Content:open-quote;

}

h3:after{

Content:close-quote;

}

h3{

Quotes: "" """";

}

dot | Circle circle | Square square | Decimal digital | Decimal-leading-zero decimal number | Lower-roman lowercase roman text | Upper-roman uppercase Roman text | Lower-greek lowercase Greek alphabet | Lower-latin lowercase latin | Upper-latin uppercase Latin | Armenian Armenian numeral | Georgian Georgia digital | Lower-alpha lowercase English alphabet  | Upper-alpha uppercase English alphabet  | None no | Inherit inherit

CSS3 Insert content in page