用css来设置div的位置

html-css018

用css来设置div的位置,第1张

设置*{margin:0padding:0}给它个初始化就行了。这个就是预定义。我通常用个定义一个站所有的初始化*{margin:0padding:0}

img{border:0}

td { line-height:25px}

ul,li{ list-style-type:none}

body {

margin: 0px

background-color:#ffffff

font-size: 12px

height:100%

background-repeat:repeat-x

background-position:center top

}

html {

height:100%

}

.clear { clear:both}

a {color:#f00font-size:12pxtext-decoration:underline}

a:hover {color:#f00text-decoration:none}

ul {

margin: 0px

padding: 0px

}

li {

margin: 0px

padding: 0px

}

建议使用css实现,效果更佳,使用position: fixed,固定定位,具体位置的调整是用top、left、right、bottom也可以使用margin调整

css实现代码

<div style="position: fixedtop:100pxleft: autoright: auto bottom: auto" ></div>

一般的网站的浮动广告以及浮动菜单等可以使用fixed来实现,js的话需要计算位置以及滚动条滚动时触发事件从而进行计算使用window.onscroll事件代码如下

HTML部分代码

<div style="position:absolutebackground-color:redwidth: 50pxheight: 50px" id="box"></div>

Javascript部分代码

window.onscroll=function(){

var box= document.getElementById("box")

var t = document.documentElement.scrollTop || document.body.scrollTop

box.style.top=t+"px"

}

<IMG style="position:absoluteleft:100top:100" src="http://img.baidu.com/img/logo-zhidao.gif">