1.HTML中的三种布局方式
- 标准流
- 浮动
- 定位
2.HTML中的两大元素
- 块级元素
div
、H1~H6
、table
、ul li ol
、p
、- 内联元素
span
、img
、a
、input
、
3.position属性的意义
- position属性决定了元素将如何定位
- 通过top、right、bottom、left实现位置
position中的可选参数
static
relative
----- 相对定位absolute
----- 绝对定位、脱离文档流,起作用必须与left、top一起使用(注:相对于窗口定位,设置body高度没有用)
test(absolute):想象demo所在位置
<style>
.par{
height:2500px;
border:1px solid red;
width:1000px;
margin-top:100px;
margin-left:100px;
background:blue;
}
.demo{
height:100px;
width:100px;
background:red;
position:absolute;
right:100px;
bottom:100px;
}
</style>
<body>
<div class="par">
<div class="demo"></div>
</div>
<body>
- fixed -----脱离正常标准流、不受制与父元素
- inherit----继承
4. z-index:可以设置元素的叠加顺序,但依赖·定位属性·
- z-index大的元素会覆盖z-index小的元素
- z-index为auto的元素不参与层级比较
- z-index为负值,元素被普通流中的元素覆盖
网友评论