45IT.COM- 电脑学习从此开始!
DIY硬件教程攒机经验装机配置
设计Photoshop网页设计特效
系统注册表DOS系统命令其它
存储主板显卡外设键鼠内存
维修显卡CPU内存打印机
WinXPVistaWin7unix/linux
CPU光驱电源/散热显示器其它
修技主板硬盘键鼠显示器光驱
办公ExcelWordPowerPointWPS
编程数据库CSS脚本PHP
网络局域网QQ服务器
软件网络系统图像安全
页面导航: 首页 > 设计学院 > 网络编程 > CSS教程 >

浅谈网页DIV定位

电脑软硬件应用网 45IT.COM 时间:2011-12-13 09:30 作者:佚名

在网页制作中有的人可以会爱使用AP DIV来定位,这个使用很方便,直接在网页中用鼠标拖动就可以画出DIV来,但是别高兴的太早啊,这种方法的兼容性是很不行的,比如你最大化最小化窗口或者拖动窗口的大小什么的都会发生改变的,所以我们要先理解这个什么是绝对定位,什么是相对定位才行,只有知道了,我们自己去琢磨下定位,才能找到其中的网页技巧哦。

网页中常见的有2个定位,一种是相对定位relative和绝对定位absolute,当然还有2种,但是一般都会很常用这2种而已。

相对定位:
看词的意思也知道了,这个是相对原来的位置来定义的,比如原来该在100这,你设置了这个relative参数后,在设置下top/left。。等就会根据你设置的参数在原来100的位置来开始定位,如果你设置top为10的话,那么你就会在100的位置向下移动10个像素,如果想让他往上的话可以设置为负的如top:-10px;了。

绝对定位:
这个是相对于某个元素来给参数绝对定位的,比如你设置了这个DIV的CSS为绝对定位,而且设置了top和left都是0的话,那么这个DIV就会相对与网页的BODY定位了,会让DIV在body的左上角,绝对定位这个参数是依靠上一个元素来看的,如果你上一个元素没有设置定位的话(其中对位包括相对和绝对等)他会在找上一个元素,如果都没有设置定位的话他就会根据BODY来定位了
学习吧提示:这里就有个小技巧了,如果你想让DIV根据上一个DIV来绝对的定位,而上一个DIV不想对位的话,可以给上一个设置为相对定位,但是不要设置top或者left等属性了,这样上一个DIV的位置还是在原来那,你当前 的DIV的绝对定位也会根据上一个来实现了。

总结:
想要设置绝对定位,必须给他找个依据的对象,可以给这个对象设置为定位,但是不要给属性就可以了。
如果多个层要实现绝对定位可以设置z_index的属性来实现重叠层次的排列,值为数字,数值越大层次越高。
设置z_index设置的话这个元素必须有定位的属性否则z_index会无效
注意:一定要注意IE6的兼容性

顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
无法在这个位置找到: baidushare.htm
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
验证码:点击我更换图片
推荐知识