這段代碼中的content: ".";有什么用，解決了什么問題，為什么要用他？

代碼如下:

.clearfix:after {

clear: both;

content: ".";

display: block;

height: 0;

visibility: hidden;

}

1--

在寫HTML代碼的時候，發現在Firefox等符合W3C標準的瀏覽器中，如果有一個DIV作為外部容器，內部的DIV如果設置了float樣式，則外部的容器DIV因為內部沒有clear，導致不能被撐開。

這個clearfix的CSS使用了after這個偽對象，它將在應用clearfix的元素的結尾添加content中的內容。在這里添加了一個句號"."，并且把它的display設置成block；高度設為0；clear設為both；visibility設為隱藏。這樣就達到了撐開容器的目的啦。

2--

content的語法倒是很少用，剛剛查了下資料：

語法：

代碼如下:

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)

取值：

attr(alt)

:

使用對象的 alt 屬性的文字

代碼如下:

counter(name)

:

使用已命名的計數器

代碼如下:

counter(name, list-style-type)

:

使用已命名的計數器并遵從指定的 list-style-type 屬性

代碼如下:

counters(name, string)

:

使用所有已命名的計數器

代碼如下:

counters(name, string,

list-style-type)

:

使用所有已命名的計數器并遵從指定的 list-style-type 屬性

代碼如下:

no-close-quote

:

并不插入 quotes 屬性的后標記。但增加其嵌套級別

代碼如下:

no-open-quote

:

并不插入 quotes 屬性的前標記。但減少其嵌套級別

代碼如下:

close-quote

:

插入 quotes 屬性的后標記

代碼如下:

open-quote

:

插入 quotes 屬性的前標記

代碼如下:

string

:

使用用引號括起的字符串

代碼如下:

url(url)

:

使用指定的絕對或相對 url 地址 說明：用來和 :after 及 :before 偽元素一起使用，在對象前或后顯示內容。對應的腳本特性為 content 。示例：

代碼如下:

p:after { content: url("http:www.devguru.com");

text-decoration: none; }

p:before { content: url("beep.wav") }

你所問的問題：根據語法，應該屬于取 “ string :　 使用用引號括起的字符串 ”應該意思就是 在.clearfix對象之后顯示 . 這個字符吧

更多信息請查看IT技術專欄