div 隐藏_div的position属性

如果你想把div放到合适的位置，请看看这篇文章。

<!--

div的position属性

-->

<html>

<style>

.red

{

height:100px;

background:red;

}

.green

{

height:100px;

background:green;

position:relative;

left:50px;

top:50px;

}

.black

{

height:100px;

background:black;

}

</style>

</html>

position是位置，定位。

定位，要选择一个参考物。

比如我的左边，我就是参考物。是我的左边，不是别人的左边。

绿色相对于原来的位置做了偏移。红色，黑色不改变位置。

原来的位置，就是参考物。

偏移了多少呢？用left，top可以控制。

注意：left,top可以用正数，还可以用负数表示。

相对于原来的位置做调整。

top为负数，就是往上提

top为正数，就是往下移

left为正数，就是往右移

left为负数，就是往左移

正数和负数，表示两个相反的方向。

position属性的作用，就是可以把div块，放到任意你想放的位置。

快速实现定位。

position取值absolute

<!--

div的position属性

-->

<html>

<style>

.red

{

height:100px;

background:red;

}

.green

{

height:100px;

background:green;

position:absolute;

}

.black

{

height:100px;

background:black;

}

</style>

<div class="green">green</div>

</html>

参考物是浏览器左上角。

绿色div，他的top，left是相对于浏览器最左上角的偏移。

top，left可以设置为正数和负数，正数和负数代表方向相反。

绿色设置了absolute之后，黑色的位置也会发生变化。

position设置成了absolute，就会被下面的div上移覆盖。

实现了隐藏div的功能。也就是脱离了文档流。

参考网站：

CSS position 相对定位和绝对定位www.runoob.com

div 隐藏_div的position属性相关推荐

总结一下CSS中的定位 Position 属性
在CSS中,Position 属性经常会用到,主要是绝对定位和相对定位,简单的使用都没有问题,尤其嵌套起来,就会有些混乱,今记录总结一下,防止久而忘之. CSS position 属性值: absol ...
position属性absolute与relative 详解不为人知的（fixed）绝对定位(fixed相对于浏览器窗口=不动的div)
From:http://www.cnblogs.com/wiseblog/articles/4352007.html Top,Right,Bottom,Left(下称TRBL,TRBL可以折分使用.) ...
DIV position属性
DIV定位,position属性 absolute :绝对定位位置相对离元素最近父级文档流的左上角,会脱离文档流,飘起来. 配合top.right.bottom.left使用. 有意思的是绝对定位也 ...
html动态显示隐藏div,div隐藏与显示属性怎么让一个div显示一个div隐藏
怎么让一个div显示一个div隐藏总是显示 js控制div显示与隐藏,js利用"hover"属性 1.首先样式要设定好,在每个li区域只能显示a或者b. 2.引入js库代码(jq ...
CSS定位布局display/float/position属性之间的关系/区别和如何使用取值行为机制
float: left|right; 可以自动排列自动折行, 但需要clear来配合清除浮动; display: inline-block; 有些时候可以替代float实现相同的效果. positio ...
关于CSS中position属性和overflow属性的使用小结
关于CSS中position属性和overflow属性的使用小结 position属性用于设置某个元素的位置类型.取值类型可以有:static.relative.absolute.fixed.inh ...
web前端中——this指向以及this的应用，函数的调用——this代码举例说明——举例：当鼠标划到列表上时，出现div内容，当鼠标移开列表时，div隐藏
一: //this:这个 //想要知道this代表着什么可以直接在中输入alert(this); //由此可以看出window是JS中的"老大" eg:alert(1);其实就是w ...
css position属性
position 属性规定元素的定位类型. 主要属性有:static,fixed,relative,absolute ,下面一一来说明下 static:默认值.没有定位,元素出现在正常的流中(忽略 t ...
CSS中position属性( absolute | relative | static | fixed )详解
我们先来看看CSS3 Api中对position属性的相关定义: static:无特殊定位,对象遵循正常文档流.top,right,bottom,left等属性不会被应用. relative:对象遵循 ...

div 隐藏_div的position属性

div 隐藏_div的position属性相关推荐

最新文章

热门文章