div怎麼隨網頁大小變動?(參考無名版型)－就是要你愛上我!!!

Dec 10 Tue 2013 12:51
div怎麼隨網頁大小變動?(參考無名版型)

只好拿我的無名來說= =
http://www.wretch.cc/blog/superhippo

他的網頁是div包裹div組成的
我想問的是那放在裡面的div怎麼設他的位置
(應該不可能單用margin-left，
因為這樣的話網頁大小變動的話，裡面的div就不會跟外面那層的div對在一起)

所以我想用可能是用javascript弄的
但是要怎麼設呢?
希望大家幫我解決這個疑惑，謝謝

eakfix">

內活頁(div)如果設定 position:absolute 就以外活頁的左上角為根據點，如果 top 或 left 為負數就會超出外活頁範圍，設為很大就會就出右，下方。

操控活頁是 css and javascript 聯手。

你將下面抄成網頁試試，將會對認識活頁有幫助。

<html>
<script type='text/javascript'>

function chg(){
f = document.forms[0]
d = document.getElementById('inside').style

d.left            = f._L.value
d.top             = f._T.value
d.width           = f._W.value
d.height          = f._H.value
d.color           = f._F.value
d.backgroundColor = f._B.value

}

</script>

<body>
<pre>
<form>
                      Alter inside div
            Left:<input name="_L" style="width:200px" value=50>
             Top:<input name="_T" style="width:200px" value=50>
           Width:<input name="_W" style="width:200px" value=100>
          Height:<input name="_H" style="width:200px" value=100>
      Font color:<input name="_F" style="width:200px" value='FFFF00'>
Background color:<input name="_B" style="width:200px" value='0000FF'>
                       <input type='button' value="改變" style="width:100px" onClick="chg()">
</pre>
</form>

<div id="outside" style="position:absolute; top:200px; left:300px; width:500px; height:400px; background-color:red;">
outside div
<div id="inside" style="position:absolute; top:50px; left:50px; width:100px; height:100px; background-color:blue; color:yellow;">
Inside div
</div>
</div>

</body>
</html>