003-CSS核心屬性

1. 文本大小 {font-size:12px/14px/16px}

   說明：
   1）屬性值爲數值型時，必須給屬性值加單位，屬性值爲0時除外。
   2）單位還能夠是pt，9pt=12px;
   3）爲了減少系統間的字體顯示差別，IE Netscape Mozilla的瀏覽器製做商於1999年召開會議，共同肯定16px/ppi爲標準字體大小默認值,即1em.默認狀況下，1em=16px,0.75em=12px; 1rem 相對於根元素的倍數
   4)使用絕對大小關鍵字

   xx-small   =9px
      x-small    =11px
      small      =13px
      medium     =16px
      large      =19px
      x-large    =23px
      xx-large   =27px

2. 文字顏色{color: white}
   說用十六進制表示顏色值：

   0  1  2  3  4   5  6  7  8  9
      0  1  2  3  4   5  6  7  8  9  A  B  C  D  E  F

   顏色模式：

   光色模式 R         G      B
              FF        00     00

   顏色值的縮寫：

   當表示三原色的三組數字同時相同時，能夠縮寫爲三位;
      當用十六進制表示顏色值時，須要在顏色值前加「#」

3. 文本字體{font-family: "字體1", "字體2"}

   說明：
          *當字體是中文字體時需加引號；
          *當英文字體中有空格時需加引號如「Times New Roman」；
          Windows中文版本操做系統下，中文默認字體爲宋體或者新宋體，英文字體默認爲Arial.
    
    
      加粗 {font-weight: bold/normal/100-900}     
      傾斜 {font-style: italic/oblique}
          1）在css規範中把字體的粗細分爲9個等級，分別從100-900，
          其中100對應最輕的字體變形，而900對應最重的字體變形。
          100-500常規字體600-900加粗字體

4. 對齊方式

   水平/垂直:

   {text-align:left/right/center/justify（justify個別瀏覽器不兼容，)
      {vertical-align:top/bottom/middle/baseline;}(只有inline-block（能設置大小，默認排在一行）元素類型支持)

5. 行高

   說明：
          1）當單行文本的行高等於容器高時，可實現單行文本在容器中垂直方向居中對齊；
          2) 當單行文本的行高小於容器高時，可實現單行文本在容器中垂直中齊以上任意位置.
          3) 當單行文本的行高大於容器高時，可實現單行文本在容器中垂直中齊如下任意位置.（IE6及如下版本存在瀏覽器兼容問題）

6. 文本修飾

   text-decoration:
        說明：none:沒有修飾
        underline:添加下劃線
        overline:添加上劃線
        line-through:添加刪除線
        blink：閃爍（不兼容）

7. 首行縮進

   {text-indent}說明：

   1）text-indent能夠取負值；
      2）text-indent屬性只對第一行起做用。

   字間距{letter-spacing:value;}

   控制英文字母或漢字的字距。

   詞間距{word-spacing:value;}

   控制英文單詞詞距。

8. 文字方向文本流控制{layout-flow:horizontal/vertical-ideographic;}說明：

   1）horizontal:自左向右
    2）vertical-ideographic:自上而下

9. 文字屬性 {font: bold italic 16px/1.5 Arial}

   font屬性的簡寫：字號，行高，
   字體說明:font的屬性值應按如下次序書寫(各個屬性之間用空格隔開)
   順序: font-style     font-weight     font-size / line-height      font-family

10. 列表樣式定義列表符號樣式：

    1)list-style-type:disc(實心圓)/circle（空心圓）/square(實心方塊 )none(去掉列表符號)；
     2)使用圖片做爲列表符號：list-style-image:url(所使用圖片的路徑及全稱);
     3)定義列表符號位置：list-style-position:outside/inside;list-style:none;簡寫

11. 邊框屬性border:3px solid red;

    邊框border:線型（solid/dashed/dotted/double/none） 粗細（數值+單位） 顏色;    
       線型：solid:實線，dashed:虛線，dotted:點狀線，double:雙線，none:沒有邊框;    
        border-width:邊框的粗細;    
        border-style:邊框的線形;     
        border-color:邊框的顏色;  
        border-top：上邊框    
        border-bottom:下邊框    
        border-left:左邊框    
        border-right:右邊框

12. 背景屬性）

    1）背景顏色語法：選擇符{background-color:顏色值;}
       
     2）背景圖片的設置語法：background-image:url(背景圖片的路徑及全稱);
        插入圖片：屬於網頁內容，也就是結構。
        背景圖：屬於網頁的表現，背景圖上能夠顯示文字、插入圖片、表格等。
       
     3）背景圖片的顯示原則       
        1）容器尺寸等於圖片尺寸，背景圖片正好顯示在容器中;       
        2）容器尺寸大於圖片尺寸，背景圖片將默認平鋪，直至鋪滿元素；        
        3）容器尺寸小於圖片尺寸，只顯示容器/元素/範圍之內的背景圖。
    
     4）背景圖片平鋪屬性語法：
            {background-repeat:no-repeat/repeat/repeat-x/repeat-y }
            no-repeat:不平鋪
            repeat：平鋪
            repeat-x：橫向平鋪
            repeat-y ：縱向平鋪
    
     5）背景圖片的位置語法：
         選擇符{background-position:left/center/right/數值 top/center/bottom/數值;}
         background-position:值1    值2;
         水平方向上的對齊方式（left/center/right）或值    
         垂直方向上的對齊方式(top/center/bottom)或值兩個值 ：第一個值表示水平位置的值，第二個值：表示垂直的位置。當兩個值都是center的時候寫一個值就能夠表明的是水平位置和垂直位置都在中間。 
         
     注：當元素小圖片大，寫圖片的某個位置時：說明：向右方向，向下方向是負值

13. CSS繼承概念：

• 所謂繼承，就是父元素的規則也會適用於子元素。繼承得來的規則沒有特殊性。好比給body設置爲color:Red;那麼他內部的元素若是沒有其餘的規則設置，也都會變成紅色。

  內聯元素可繼承：letter-spacing、word-spacing、white-space、line-height、color、font-family、font-size、font-style、font-weight、text-decoration、text-transform.塊狀元素可繼承：text-indent和text-align。
    列表元素可繼承：list-style、list-style-type、list-style-position、list-style-image。
    表格元素可繼承：border-collapse。