CSS&CSS3零碎知識點

關於CSS的那點兒事！

_{前端看似簡單，學起來並不容易，前端發展迅速，一個還沒徹底弄懂又發展新的了，於是乎，就特意從基礎開始學，這裏總結一下關於CSS的，隨時補充}

part1

1. 外部樣式表插入方式：
   <link href="css文檔地址" type="text/css" rel="stylesheet" >

2. 字間距：letter-spacing（默認2px）
   單詞間距：word-spacing
   首行縮進：text-indent：2em

3. CSS3新增文字陰影屬性：
   text-shadow：水平位置 垂直位置 模糊像素 透明色rgba（0，0，0，0.5）0.5表示程度

4. 塊級元素和行內元素區別
   · 塊級元素：
   1）總是從新行開始
   2）height,line-height,margin,padding可控
   3）寬度默認爲容器100%
   4）可以容納內聯元素和其他塊元素
   · 行內元素
   1）和相鄰行內元素在一行上
   2）高寬無效，但水平方向的margin，padding可控
   3）默認寬度就是本身內容的寬度
   4）行內元素只能容納文本或其他行內元素
   · 行內塊元素：<img/> <input/> <td>_{！！可以對他們設置寬，高和對齊屬性！！}
   1）和相鄰行內元素（行內塊）在同一行，但之間會有空隙
   2）默認寬度是本身內容寬度
   3）高，行高，margin，padding都可控

5. 標題下的橫線:<hr/>

6. 網上字常用顏色 #3c3c3c，不是正常黑色

7. font-weight:normal讓標題不加粗

8. CSS複合選擇器：
   1）交集選擇器：標籤名.類名
   2）並集選擇器：p,div,v,h1{ }同時修改這些標籤的樣式
   3）後代選擇器：類名.標籤名

9. a標籤中title屬性表示鼠標懸停樣式
   屬性選擇器 (標籤內的屬性)
   a[title=xxx]{}
   a[title*=xxx]{}屬性名裏包含xxx並且在任意位置
   a[title^=xxx]{}屬性名裏包含xxx並且在最開始的位置
   a[title$=xxx]{}屬性名裏包含xxx並且在最結束的位置

10. 類選擇器：.demo
    僞類選擇器：first-child
    僞元素選擇器：::first-letter 元素::first-line
    _{first-line>letter所以letter更優先}
    雖然先改變首單詞，再改變第一行，但是樣式卻沒覆蓋
    效果如下：
    元素::before/after {content:“添加的內容”}
    _{在盒子內部內容的前或後添加內容}