CSS初步理解

標籤：style   blog   http   color   strong   os   

   最近在學習牛腩的時候遇到了網頁的製作，挺新鮮的。當中涉及到了有關CSS的知識，於是乎自己也就花費兩個小時的時間，找了本淺顯易懂的書來看了一遍，從宏觀上來瞭解CSS的相關內容。有關CSS的基礎知識詳見下連結。

CSS基礎知識

以下是對CSS理解的導圖

 

 

  通過我們也發現，CSS也很難，也容易。容易是說，學起來很快就可以上手，這中語言簡單易懂，只要你具備小學英語的知識量就可以了。困難是在指學好它並不容易，因為它需要你耐心。就好比我們對word文檔的排版，哪裡需要主體鮮明一點，哪裡需要著重突出一下，哪裡需要加一下背景圖片，這都需要考慮的，其實就是美工的工作。學習CSS也很雜，為何會這麼說呢，因為需要與PS、photoshop聯絡起來。

  以下是一些常見的屬性設定

文字樣式
    line-height:行間距
    letter-spacing：字間距
    text-decoration：標題處關鍵字的底線
    font-style：設定字型風格
    font-weight:字型粗細
    border-style:邊框樣式
    border-width：邊框粗細
    vertical-align:圖片相對於文字對齊

背景圖片
    background-image:添加背景圖片
    background-repeat:背景圖片的重複方式
    background-position:背景圖片的位置
    background-attachment:固定背景圖片

CSS設定表格與表單的樣式
    border-collapse:邊框重疊
    list-style-type:用來清除列表前面的標記

設定頁面和瀏覽器的元素
    <a href=""></a>:添加超連結
    a:link:超連結的普通樣式
    a:visited：被點擊過的超連結的樣式
    a:hover:滑鼠經過超連結上的樣式
    a:active：在超連結上單擊時
    cursor：設定滑鼠的顯示樣式

 

用CSS製作實用的菜單
    <ul></ul>:實用列表
    list-style-type:項目列表的標題
    list-type-image:項目列表可以設定為圖片
    display：block ：塊級顯示

看看這些屬性是不是so easy呢？ 只要略微的熟悉一下，你就可以稱的上是半個CSS專家了。

從導圖中我們也可以看到，如果能夠把CSS布局學懂的話，就算成功一半多了，所以下篇部落格將會講CSS中的盒子模型。