CSS屬性-1

CSS屬性

    關于尺寸的

        width  設置寬

        height  設置高

        min-width:  設置最小寬度

        max-width:  設置最大寬度

        min-height:  設置最小高度

        max-height:  設置最大高度

    關于文字的

        font-family:微軟雅黑;   設置文字字體

        font-size:16px;     設置文字大小

        font-weight:bold;   設置文字加粗

        color:設置文字顏色

        font-style:italic   設置字體為斜體

                   oblique 設置文字傾斜

        letter-spacing:2px|em   設置字間距

        line-height  設置行高

   關于文本的

     text-indent:   首行縮進

     text-align：對其方式   left(左)|right(右)|center（居中）

     text-shadow：2px 5px 1px #ccc   文字陰影   第一個表示水平偏移量，第二個參數表示垂直偏移量，第三個參數表示模糊量，第四個參數表示陰影顏色

     text-decoration:overline(上劃線)|underline(下劃線)|line-through(刪除線)|none(無)

     text-decoration-color:red|#cccccc   設置線的顏色

     text-decoration-style:dashed(虛線)|double(雙線)|solid(實線)|wavy(波浪線)|dotted(點狀線) 

      text-decoration- position:

關于列表

    list-style:none   取消列表樣式

    list-style-p_w_picpath:url（）  修改列表樣式為圖片

    list-style-position:inside(里邊)|outside(外邊)

    list-style-type:

關于邊框

    border:1px solid #ccc  第一個參數表示邊框的大小，第二個參數表示邊框的樣式，第三個參數表示邊框的顏色

    第二個參數可取值：solid(實線)|dashed(虛線)|dotted(點狀線)|double(雙線)|groove(3D凹槽輪廓)|ridge(3D凸槽輪廓)|inset(3D凹邊輪廓)|outset(3D凸邊輪廓)

    border-style:solid|dashed

    border-color:#cccccc

    border-width:2px

    border-bottom:1px solid #ccc   設置下邊框

    border-top:1px solid #ccc    設置上邊框

    border-left:1px solid #ccc    設置左邊框

    border-right:1px solid #ccc    設置右邊框

    border-radius:2px 2px 3px 5px    設置圓角

    border-top-left-radius:    設置左上角

    border-top-right-radius    設置右上角

    border-bottom-left-radius   設置左下角

    border-bottom-right-radius  設置右下角

    border-p_w_picpath:url()       設置邊框為一張圖片

    border-p_w_picpath-repeate:

            stretch：指定用拉伸方式來填充邊框背景圖。

            repeat：指定用平鋪方式來填充邊框背景圖。當圖片碰到邊界時，如果超過則被截斷。

            round：指定用平鋪方式來填充邊框背景圖。圖片會根據邊框的尺寸動態調整圖片的大小直至正好可以鋪滿整個邊框。

            space：指定用平鋪方式來填充邊框背景圖。圖片會根據邊框的尺寸動態調整圖片的之間的間距直至正好可以鋪滿整個邊框。

    box-shadow:2px 5px 2px 20px inset

        第一個參數水平偏移量，第二個參數垂直偏移量，第三個參數模糊設置，第四個參數延伸設置，第五個參數省略時外陰影，存在時內陰影

    關于背景

    background:color|p_w_picpath   設置背景為顏色或者圖片

    background-color:red|#0ff  設置背景顏色

    background-p_w_picpath:url()   設置背景圖片

    background-size:20px|20% 50px|30%   設置背景圖大小

    background-postion: left|right|center|bottom|top背景圖片位置

               left 20px

插入多張背景圖片

background-p_w_picpath:url(*.jpg) 0 0,url(*.jpg) 210px 40px

0 0和210px 40px 表示的是每張背景圖的開始位置坐標

   關于補白(內邊距、外邊距)

    margin：1px  上下左右外邊距為1px

    margin:2px 4px   上下外邊距為2px，左右外邊距為4px

    margin：5px 10px 15px 20px   上外邊距為5px，右外邊距10px，下外邊距15px，左外邊距20px

            方向是上右下左

    margin-top:5px

    margin-right:10px

    margin-bottom:15px

    margin-left:20px

    內邊距

    padding：1px  上下左右內邊距為1px

     padding:2px 4px   上下內邊距為2px，左右內邊距為4px

    padding：5px 10px 15px 20px   上內邊距為5px，右內邊距10px，下內邊距15px，左內邊距20px

            方向是上右下左

     padding-top:5px

     padding-right:10px

     padding-bottom:15px

     padding-left:20px

關于布局的

    display:block;   行轉塊  或者顯示

    display:none    隱藏不占空間

    opacity:0.5   設置透明度

    filter:alpha(opacity=50)  IE下設置透明度

    overflow：hidden   超出部分隱藏

         scroll   顯示滾動條

          auto    當有內容超出容器時顯示滾動條  

    overflow-x：橫向超出部分隱藏

    overflow-y：縱向超出部分隱藏

定位

position:fixed;  固定定位

position:absolute  絕對定位

position:relative   相對定位

z-index：1-999   調整層關系，數值越大越優先顯示

浮動

標準流盒子認為非標準流盒子不占空間，非標準流盒子認為標準流盒子占空間

float:left    左浮動

float:right   右浮動

clear:both;   清除浮動