
|
網(wǎng)頁的本質(zhì)就是超級文本標(biāo)記語言,通過結(jié)合使用其他的Web技術(shù)(如:腳本語言、公共網(wǎng)關(guān)接口、組件等),可以創(chuàng)造出功能強(qiáng)大的網(wǎng)頁。因而,超級文本標(biāo)記語言是萬維網(wǎng)(Web)編程的基礎(chǔ),也就是說萬維網(wǎng)是建立在超文本基礎(chǔ)之上的。超級文本標(biāo)記語言之所以稱為超文本標(biāo)記語言,是因?yàn)槲谋局邪怂^“超級鏈接”點(diǎn)。 【實(shí)例介紹】 css absolute絕對定位屬性 當(dāng)容器的position屙l生值為absolute時,這個容器即被絕對定位了。絕對定位在幾種定位了法中使用最廣泛,這種方法能夠很精確地將元素移動到你想要的位置。使用絕對定位的容器.其前面或者后面的容器會認(rèn)為這個層并不存在,即這個容器浮于其他容器上,它是獨(dú)立出來的.所以用position:absolute將一個元素放到固定的位置非常方便。 【基本語法】 position:absolute 【語法介紹】 通過left、right、top、bottom等屬性與margin、padding、border進(jìn)行絕對定位,絕對定位的元素可以有邊界,但這些邊界不壓縮。定位的方法是在CSS中設(shè)置容器的top(頂部)、bottom(底部)、left(左邊)和right(右邊)的值,這4個值的參照對象是瀏覽器的4條邊。 【實(shí)例代碼】
【代碼分析】 這里3個diV都沒有設(shè)置絕對定位,可以看到一個父diV里面有3個div,都是標(biāo)準(zhǔn)流方式排列,效果如圖所示。
下面使用絕對定位方式,在代碼中找到對#block2的CSS設(shè)置位置,目前它是空的,下面把它改為如下代碼。 這里將box2的定位方式改為絕對定位absolute,此時效果如圖所示。這時是以瀏覽器窗口作為定位基準(zhǔn)的。此外,該div會徹底脫離標(biāo)準(zhǔn)流,box3會緊挨著boxl,就好像沒有box2一樣。
下面將block2的設(shè)置修改如下。 這時的效果如圖所示,以瀏覽器為基準(zhǔn),從左上角開始向下和向左各移動100緣素.
【素材及源碼下載】 請點(diǎn)擊:絕對定位屬性(css absolute) 下載本實(shí)例相關(guān)素材及源碼
網(wǎng)站建設(shè)是一個廣義的術(shù)語,涵蓋了許多不同的技能和學(xué)科中所使用的生產(chǎn)和維護(hù)的網(wǎng)站。 |
溫馨提示:喜歡本站的話,請收藏一下本站!