html5學習筆記

1.到目前爲止,可以兼容所有瀏鑑器的“僞類選擇符”就是 a 標籤上使用 :hover 了(其實僞類選擇符還有很多,尤其是 css3 中,但是因爲不能兼容所有瀏鑑器,本教程只是講了這一種最常用的)。其實 :hover 可以放在任意的標籤上,比如說 p:hover,但是它們的兼容性也是很不好的,所以現在比較常用的還是 a:hover 的組合。
2、段落排版--縮進
p{text-indent:2em;}
3、段落排版--行間距(行高)
p{line-height:1.5em;}
display:inline將元素設置爲內聯元素
內聯元素特點:
1、和其他元素都在一行上;
2、元素的高度、寬度、行高及頂部和底部邊距不可設置;
3、元素的寬度就是它包含的文字或圖片的寬度,不可改變。
行內元素之間會產生間隙bug問題的場景:當行內元素之間有“回車”、“tab”、“空格”時就會出現間隙
inline-block元素特點:
1、和其他元素都在一行上;
2、元素的高度、寬度、行高以及頂和底邊距都可設置。
元素內容與邊框之間是可以設置距離的,稱之爲“填充”。填充也可分爲上、右、下、左(順時針)。如下代碼:
div{padding:20px 10px 15px 30px;}
順序一定不要搞混。可以分開寫上面代碼:
div{
   padding-top:20px;
   padding-right:10px;
   padding-bottom:15px;
   padding-left:30px;
}
如果上、右、下、左的填充都爲10px;可以這麼寫
div{padding:10px;}
如果上下填充一樣爲10px,左右一樣爲20px,可以這麼寫:
div{padding:10px 20px;}
一般情況下因爲對於中文網站,英文還是比較少的,所以下面縮寫代碼比較常用:
body{
    font:12px/1.5em  "宋體",sans-serif;
}

發佈了24 篇原創文章 · 獲贊 3 · 訪問量 2萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章