關(guān)于定位的元素，大家知道是一個通用的position，相對定位relative只是定位中的一個屬性，我的理解是：相對定位不是相對于其他元素，而是被相對于被包含塊（子元素）。如果只定義一個position:relative;這個不會產(chǎn)生太大的效果，但是它的本質(zhì)已經(jīng)變了，從網(wǎng)頁內(nèi)變到了“網(wǎng)頁外”。為什么這么說呢？我去年做一個朋友的廣告，發(fā)現(xiàn)運用了position的塊竟然能夠遮擋住網(wǎng)頁內(nèi)的漂浮廣告，還有運用了這個元素的塊明顯加載比較快，我又實驗了幾次都會出現(xiàn)這種情況，在此之前我真的對position的這個效果一點都不理解，后來我找了我經(jīng)常看的書，上面是這樣描述的：“相對定位（relative）：元素可以在文檔流中的位置進行定位。”基于這個我實驗了下，代碼如下：
1 .relative2 {3 position:relative;4 left:-50px;5 right:-40px;6 background-color:#ccc;7 }居然ok可以定位，但它和絕對定位的區(qū)別就在于它不是基于包含塊（父元素）來定位的，它是基于自己原來所在文檔流中的位置來定位的。所以我認為它已經(jīng)半脫離了網(wǎng)頁，它是浮在網(wǎng)頁之上的，但是又占據(jù)著文檔流中的位置。
大家可以試驗一下，下面我想講的是我對z-index堆放次序的理解：
z-index屬性允許決定元素的堆放次序。z指的是z軸，它說明不是處理左右定位（x軸）或者上下定位（y軸），而我理解它好像就是使用3d效果那樣，可以重疊堆放一層一層的摞起來。當(dāng)元素重疊而且標(biāo)記流內(nèi)置的默認堆放設(shè)置無法實現(xiàn)的效果時，z-index很重要，因為這是在使用絕對定位時非常常見。
對于z-index可以使用兩種值：
1.整數(shù)（0、1、2、3）
2.out
out值是默認的一個值，這個值只用來覆蓋在css中其他地方聲明的另一個樣式。不過很多時候我使用的是整數(shù)。
在使用整數(shù)時，z-index的值最高的那個要出現(xiàn)在比這個值低的元素上面。打個比方來說手里拿了10張撲克，最上面的是10，最下面那個是1就行了。在一個包含塊中，z-index值為1的元素總在值為10的元素的下面，也就是說值大的永遠排在最上面。
舉個例子，代碼如下：
1 <div id=product>2 <div id=sale-price></div>3 <div id=product_photo></div>4 </div>相對應(yīng)的css
1 #product2 {3 position:relative;4 }5 #sale-price6 {7 position:absolute;8 z-index:2;9 }10 #product_photo11 {12 position:absolute;13 z-index:1;14 }如果這兩個元素定位的位置相互重疊的話，z-index值最高的#sale-price元素出現(xiàn)在#product_photo的上面。


網(wǎng)站建設(shè)中需要遵循的優(yōu)化原則
手機網(wǎng)站建設(shè)需要注意哪些地方？
為什么網(wǎng)站建設(shè)有些公司報價很便宜？網(wǎng)站的價格便宜之因
營銷型網(wǎng)站改變了什么？
網(wǎng)站建設(shè)規(guī)劃的常見錯誤和解決辦法
建設(shè)營銷型網(wǎng)站的六個方面
跨境電商下一步的發(fā)展趨勢是什么？
網(wǎng)站的robots.txt寫法有什么好處