CSS一些小總結個人向

這篇文章總結的是自己覺得必須記住的一些css小知識和css小技巧等。

1.字型加粗

其實我們用css的font-weight為字型加粗已經很常見了，但是還是有一些我們在用時就很迷惑但卻沒去搞懂的知識點

注意：使用b元素，實際情況下使用字型的一種加粗變形來顯示b元素的字型。因此，如果使用times字型顯示乙個段落，而且其中一部分是粗體，那麼實際上當前使用了同一字型的兩種變形：times和timesbold。常規的文字使用times顯示，加粗的問題使用timesbold顯示。

如果乙個字型採用了乙個數值梯度，它內建了9個加粗級別，那麼這些數字就直接對映到預定義的級別，100對應最細的字型變形，900對應最粗的字型級別

但是如果給定的字型系列中定義的加粗度少於9種，使用者**還必須多做一些工作

•如果未指定值500的加粗度，其字型加粗與400的相應加粗相同。

•如果未指定300的加粗度，則為之指定下乙個比400更細的變形。如果沒有可用的較細變形，為300指定的變形等同於400的相應變形。在這種情況下，通常是normal或medium。這種方法同樣適用於200和100。

•如果未指定600的加粗度，會為之指定下乙個比400更粗的變形。如果沒有可用的較粗變形，為600指定的變形則等同於500的相應變形。這種方法同樣適用於700、800和900

因此不知道哪個數值梯度才有相應的字型變形，因此我更喜歡用bolder和lighter。

2.輪廓

css2還引入了使用者介面樣式中的最後乙個主要方面：輪廓。輪廓有點類似於邊框，不過二者有兩個重要的區別。首先，輪廓不像邊框那樣參與到文件流中，因此輪廓出現或消失時不會影響到文件流，即不會導致文件的重新顯示。其次，輪廓可能不是矩形，是梯形。

不過和邊框的用法是一樣的，只不過只能為乙個outline-style值指定乙個關鍵字，而邊框最多4個關鍵字。而且沒有outline-top或outline-right之類的屬性

另外outline是乙個簡寫屬性，但它不支援outline-offset屬性，得另外寫，它規定邊框邊緣的距離

相容性：ie所有版本不支援

3.table-layout屬性

tablelayout 屬性用來顯示**單元格、行、列的演算法規則。

固定**布局與自動**布局相比，允許瀏覽器更快地對**進行布局。

在固定**布局中，水平布局僅取決於**寬度、列寬度、**邊框寬度、單元格間距，而與單元格的內容無關。

通過使用固定**布局，使用者**在接收到第一行後就可以顯示**。

在自動**布局中，列的寬度是由列單元格中沒有折行的最寬的內容設定的。

此演算法有時會較慢，這是由於它需要在確定最終的布局之前訪問**中所有的內容。

該屬性指定了完成表布局時所用的布局演算法。固定布局演算法比較快，但是不太靈活，而自動演算法比較慢，不過更能反映傳統的 html 表。

4.行內替換元素影響行框的高度，但不影響line-height

5.文字溢位

①單行文字溢位

.oneline

②多行文字溢位

.twoline

CSS一些小總結 個人向