借助CSS定位來(lái)實(shí)現(xiàn)把一個(gè)DIV放到另一個(gè)div右下角
發(fā)布時(shí)間：2014-01-08 17:46:29 作者：佚名 
我要評(píng)論
我要評(píng)論借助CSS定位來(lái)實(shí)現(xiàn)，將右下角的那個(gè)DIV放在另一個(gè)DIV里面，具體的實(shí)現(xiàn)如下，希望對(duì)大家有所幫助
借助CSS定位來(lái)實(shí)現(xiàn)，你將右下角的那個(gè)DIV放在另一個(gè)DIV里面，參考代碼如下示：
<div id="box1">
<div id="box2">測(cè)試內(nèi)容</div>
</div>
<style>
<!--
#box1{width:600px;height:600px;background:green;position:relative}
#box1 #box2{width:200px;height:200px;background:red;position:absolute;right:0;bottom:0}
-->
</style>
父對(duì)象相對(duì)定位，子對(duì)象以父對(duì)象為參考點(diǎn)絕對(duì)定位；
外層的div設(shè)置為相對(duì)定位，內(nèi)層的div設(shè)置為絕對(duì)定位；
復(fù)制代碼
代碼如下:<div id="box1">
<div id="box2">測(cè)試內(nèi)容</div>
</div>
<style>
<!--
#box1{width:600px;height:600px;background:green;position:relative}
#box1 #box2{width:200px;height:200px;background:red;position:absolute;right:0;bottom:0}
-->
</style>
父對(duì)象相對(duì)定位，子對(duì)象以父對(duì)象為參考點(diǎn)絕對(duì)定位；
外層的div設(shè)置為相對(duì)定位，內(nèi)層的div設(shè)置為絕對(duì)定位；
相關(guān)文章
- 互聯(lián)網(wǎng)提供了很多種“將廣告始終定位到網(wǎng)頁(yè)右下角”的解決方案，大多會(huì)用到j(luò)avascript，其實(shí)僅調(diào)用樣式表就可以實(shí)現(xiàn)該效果。 以下萬(wàn)惡的代碼主要是寫給IE6的，2009-06-22
css偽類 右下角點(diǎn)擊出現(xiàn) 對(duì)號(hào)角標(biāo)表示選中的示例代碼
這篇文章主要介紹了css偽類 右下角點(diǎn)擊出現(xiàn) 對(duì)號(hào)角標(biāo)表示選中，本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2020-06-22css返回頂部圖標(biāo)固定在瀏覽器右下角且兼容ie6
返回頂部圖標(biāo)固定在瀏覽器的右下角的相關(guān)文章可以在網(wǎng)上找到很多，但是同時(shí)兼容ie6的就不多了，本例為大家介紹的這段css樣式代碼就是可以兼容ie6的，感興趣的朋友可以參考2013-10-20
純css 右下角定位_并結(jié)合js實(shí)現(xiàn)關(guān)閉功能(兼容多瀏覽器)
純css 右下角定位_并結(jié)合js實(shí)現(xiàn)關(guān)閉功能腳本之家特別版，比較適合做右下角廣告的朋友，兼容多瀏覽器。2010-02-10
css實(shí)現(xiàn)網(wǎng)頁(yè)右下角點(diǎn)贊小卡片效果（實(shí)例代碼）
這篇文章主要介紹了css實(shí)現(xiàn)網(wǎng)頁(yè)右下角點(diǎn)贊小卡片效果，本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-09-02
