可以采用css中的position来实现决定定位。
1、代码实例如下:
<html><head>
<style type="text/css">
p.one
{
position:fixed
left:5px
top:5px
}
p.two
{
position:fixed
top:30px
right:5px
}
</style>
</head>
<body>
<p class="one">一些文本。</p>
<p class="two">更多的文本。</p>
</body>
</html>
此实例是相对于浏览器边框进行的定位。
2、补充相关知识
bsolute
生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位。
元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。
fixed
生成绝对定位的元素,相对于浏览器窗口进行定位。
元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。
relative
生成相对定位的元素,相对于其正常位置进行定位。
因此,"left:20" 会向元素的 LEFT 位置添加 20 像素。
static 默认值。没有定位,元素出现在正常的流中(忽略 top, bottom, left, right 或者 z-index 声明)。
inherit 规定应该从父元素继承 position 属性的值。
html代码<body>
<DIV id="container">
<DI id="content">
<h1>Content</h1>
<p>请改变浏览器窗口的高度,以观察footer效果。</p>
<p>这里是示例文字,DIV固定………,这里是示例文字。</p>
</DIV>
<DIV Vid="footer">
<h1>Footer</h1>
</DIV>
</DIV>
</body>
CSS代码:
程序代码
body,html{
margin:0
padding:0
font:12px/1.5arial
height:100%
}
#container{
min-height:100%
position:relative
}
#content{
padding:10px
padding-bottom:60px
/*20px(font-size)
x2(line-height)+10px(padding)x2=60px*/
}
#footer{
position:absolute
bottom:0
padding:10px0
background-color:#AAA
width:100%
}
#footerh1{
font:20px/2Arial
margin:0
padding:010px
}