相关文章
网站制作Css:制作一个更漂亮一些的多选列表框
企通互联CH经典CSS入门教程
北京网页设计模板设计完全学习视频教材（第七集）
北京网站建设在Dreamweaver中为插入的Flash添加透明
网站建设HTML页面如何象asp一样接受参数
北京网页设计Flash MX常用快捷键一览
企通互联精彩实例详解：用Flash实现北京奥运倒计时
网站制作Flash视频教程：小薇
企通互联文本工具栏的使用(上)
网站建设CSS长度单位的区别 - pt,px和cm的区别
品牌理念
北京网站建设最佳合作伙伴
北京网站建设专家企通互联
竭诚为您提供网站建设服务!
友好连接
文章搜索
你的位置：首页 >> 网站制作 >> 北京网站设计北京网站制作如何利用CSS堆定位元素位置
北京网站设计北京网站制作如何利用CSS堆定位元素位置
利用CSS定位Web页面上的元素有很多需要注意的地方，当你需要一个元素出现在另一个元素的位置时，经常会突然出现有趣的场景。使用CSS的z-index属性控制元素的堆放可以很容易的解决这个问题。本文为大家详细介绍CSS堆放元素的使用。
定位
元素的堆放顺序依赖于CSS的定位方面。有三种定位方式可供选择：相对定位、绝对定位和固定位置。
相对定位：定位元素通过侧偏移属性进行移动。当一个项目是相对定位时，这时会创建一个包含块将所有该项目的子项目包含其中。该块与元素的定位位置相一致，这样就可以相对一个元素的父元素来定位它，因为它的父元素的位置已经确定了。 网页设计
北京网站设计绝对定位：当元素绝对定位时，它们就被完全从页面的其它元素流中移除；也就说与绝对定位元素根据包含它们的块定位，边缘使用侧偏移属性定位。绝对定位的元素不随其它元素浮动，其它元素也不围绕它浮动。因此，一个绝对定位的元素可能会覆盖其它元素。 网站设计
固定位置：固定位置的元素和绝对定位模型类似，但是固定位置元素被完全从文档中移除，不与文档中的任何元素有相对位置。使用定位置定位，你可以仅使用CSS就可以创建类似HTML框架的接口。 北京网站建设 北京网站制作
定位元素需要指定偏移值。这些偏移通过使用顶部、左边、右边和底部样式属性来指定。每个值被解释为相应元素的外部边缘根据它原来的位置应该移动距离。
列表 网站制作A中的例子包含了相对定位和绝对定位。页面使用绝对定位和百分比值被水平分为三部分。文本使用相对定位放置在每部分中。（如果你想查看代码，请点击列表A的链接）
<html><head>企通互联
<title>CSS Positioning </title> 北京网页设计北京网站建设
<style>北京网页设计
DIV#top 北京网页设计
DIV#middle 网站设计 www.qitongnet.com
DIV#bottom 北京网页设计 网站设计
.title网页设计
</style></head><body>网站制作
<div id="top">北京网站设计
<div class="title">This is a test</div> 网站建设北京网页设计
</div>北京网站设计
<div id="middle">网站建设
<div class="title">Place some text here.</div>网页设计
</div>北京网站建设
<div id="bottom">北京网页设计
<div class="title">Thanks for visiting!</title>网站制作
</div>网站建设
</body></html>
当使用CSS定位在一个页面放置多个元素时，不可避免的会出现两个或更多元素占用页面相同位置的情况。
北京网站设计