Content in CSS: "." The role

There is a p as an external container, the internal p if the float style is set, then the external container p can not be open, the application of Clearfix at the end of the element to add content, the purpose of the open container is the contents of this code: "."; What's the use, solve the problem, why use him?

The code is as follows:

. clearfix:after {
Clear:both;
Content: ".";
Display:block;
height:0;
Visibility:hidden;
}

The

When writing HTML code, found in Firefox and other standards-compliant browser, if there is a p as an external container, the internal p if the float style is set, the external container p because the internal does not clear, resulting in cannot be open.
This clearfix CSS uses the after pseudo-object, which adds content from the contents to the end of the element where the clearfix is applied. A period "." is added here, and its display is set to block, and the height is set to 0;clear set to Both;visibility as hidden. This will achieve the purpose of the open container.

2--

The grammar of content is seldom used, just looked up the following information:

Grammar:

The code is as follows:

Content:attr (ALT) | Counter (name) |
Counter (name, List-style-type) |
Counters (name, string) |
Counters (name, String, List-style-type) |
No-close-quote | No-open-quote | Close-quote |
Open-quote | string | URL (URL)

Value:

The code is as follows:

attr (ALT)
:

Text that uses the ALT attribute of the object

The code is as follows:

Counter (name)
:

Using a named counter

The code is as follows:

Counter (name, List-style-type)
:

Use a named counter and follow the specified List-style-type property

The code is as follows:

Counters (name, string)
:

Use all named counters

The code is as follows:

Counters (name, String,
List-style-type)
:

Use all named counters and follow the specified List-style-type property

The code is as follows:

No-close-quote
:

The post-tag of the quotes property is not inserted. But increase its nesting level

The code is as follows:

No-open-quote
:

Does not insert the front tag of the quotes property. But reduce its nesting level

The code is as follows:

Close-quote
:

Insert the post tag of the quotes property

The code is as follows:

Open-quote
:

Insert the front tag of the quotes property

The code is as follows:

String
:

Use a string enclosed in quotation marks

The code is as follows:

URL (URL)
:

Use the specified absolute or relative URL address description: Used in conjunction with: After and: Before pseudo elements to display content before or after the object. The corresponding script attribute is content. Example:

The code is as follows:

P:after {content:url ("http:www.devguru.com");
Text-decoration:none; }
P:before {content:url ("Beep.wav")}

You ask the question: according to the syntax, should belong to "string: Use quoted string" should mean to be displayed after the. Clearfix object. This character.