HTML技巧

1.通過float將div排成一排

2.通過margin:0px auto來使container居中

3.margin重疊現象 相鄰得普通元素(沒有浮動),上下邊距,並非簡單得相加,而是去中間最大得值,父子元素也會發生重疊現象

4.內聯元素設置margin-top margin-bottom pading-top pading-bottom height,width都沒用 ,但是設置margin-left margin-right有效

5 通過display設置爲inline或者block進行內聯元素和塊狀元素轉換

6 通過text-indent爲段落設置縮進,text-decoration設置下劃線,text-align設置居中,設置letter-spacing來設置文字間距離,設置line-height設置行間距

7 通過background-color, background-image: url(./img/1.ico),background-repeat,background-position來設置背景,如果有含有很多小背景得大圖做背景,通過設置background-position和div得大小來拿到指定塊來做背景就可以了

8 可以通過F12,選擇某個元素在style裏面可以看到css得優先級

 

9 img是特殊得內聯元素,是替換元素,可以設置寬高,但是無法設置margin,可以將display設置爲block再設置margin

10 table需要改td設置border來顯示邊框,同時給table設置border-collapse: collapse來消除單元格之間得空隙

11 通過設置a標籤得name屬性<a name="p1"></a>可以設置錨點,然後在url後面加上#錨點名字,既可以直接跳到

12 可以通過設置a標籤得僞類a:link a:visited a:hover a:active來設置四種樣式,注意順序是LVHA

13 常見得字符實體&lt; &gt;&yen;&copy;

14 專門建一個類爲clear的div,專門用於清除浮動

<div class="clear"></div>
	.clear{
				clear: both;
				width: 0px;
				height: 0px;
			}

15  通過設置塊狀元素的行高來垂直居中 

16 設置顏色時,#EEEEEE可以簡寫成#EEE,六個一樣可以簡寫成三個

17 可以通過設置百分比來設置尺寸,塊狀元素,子元素默認佔滿父元素

18 字體可以通過em來設定,em是相對值,是相對父元素的字體大小

19 通過設置border-radius屬性設置圓角border-radius: 10px;如果設置border-radus的值是border尺寸的一半,則可以畫出來圓

20 通過設置position爲relative,然後設置top和left則可以相對位置移動,相對的是不移動前的自身位置

21 通過設置position爲absolute,則是相對於具有positon屬性的父元素的位置,如果父元素沒有position則一直往上找,直到body,絕對定位是飄起來的不影響別的元素的位置

22 通過設置overflow爲auto,則內容超出時候,可以顯示滾動條,對於特別小的元素,要加一個overflow:hidden,避免IE的bug

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章