div+css(2)

时间 2019-12-06

标签 div+css div css 栏目 HTML 繁體版

原文原文链接

浮动php

在div+css 中浮动分为左浮动，右浮动，清楚浮动css

①右浮动
html

所谓右浮动，指一个块元素向右移动，让出本身空间，像右移动直到碰到包含本身的父元素的spa

最右边的边框。.net

②左浮动code

快速入门：htm

.div{对象

width：150px;
get

height:100px;
it

border:1px solid blue;

background:pink;

margin-top:5px;

flioat:left;/*左浮动*/

}

从这个案例咱们能够看出，所谓左浮动就是指，某个块元素尽可能向左边移动，这样就让出

它右面的空间，让别的块元素显示。

浮动的特别说明：

若是浮动元素的高度不一样，那么当他们向下移动时候可能被其余的浮动元素”卡住“：

直到有足够空间。

若是使用浮动元素：则该元素无论是否是块元素，都会按照display：block;

来显示。

小总结：

你能够这么理解浮动：若是一个元素右/左浮动原则：

①它自己会儿尽量向右/左移动，直到碰到边框或者别的浮动元素，特别

强调浮动对块元素和行内元素都生效。

②元素向右/左浮动，就至关于让出本身的左/右边，别的元素就会在它的左

/右边，别的元素就会儿在它的左/右排列。

再一个案例：

<!DOCTYPE html

PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

<body>

<img style="float:left;

margin-right:5px;"

src="2.jpg" /> 爱克发

ksdkfs;dsfdf ;sdfs ;sdf s 爱克发

</body>

</html>

如何清除浮动，咱们在项目中说明

网上有一个站点；禅意花园->csdn 网页论坛

开源之祖 sourceforeg.net

php 开源 http://www.php-open.comm模仿->创新

定位

常见的定位有四种

1。static定位(默认值)

2。relative相对定位

3。sbsolute 绝对定位

4。fixed 固定定位

相对定位：

这里咱们看出，所谓相对定位是指，相对该元素应当显示的左上角从新定位，虽

然它脱离的标准流，可是它的空间，不能被占用。

绝对定位：

从上图看，所谓绝对定位指，对该元素最近的那个脱离了标准流的元素定位，如

果没有父元素(或者有父元素，可是父元素没有脱离标准流)，则相对body左上角

定位。

怎么理解上面标红的字

、

代码：

<html>
<body>
<div>内容1</div>
<div>内容3</div>
<div>内容4</div>
<div>
    <div id="spe" class="div1">内容2</div>
</div>
</body>
</html>

Css文件：

.div2{
    position:relative;
    left:100px;
    top:100px;
    width:200px;
    height:150px;
    background:pink;
    float:left;
}

Fixed 定位

所谓fixed定位就是无论怎么样，老是以视窗的左上角定位。

☞ left top属性对static没有效果，static 定位是靠margin-left margin-top

来移动位置的。

z-index

用于设置对象(div)显示的时候，层叠的属性，z-index 值越小，则越在下层显示！！

☞ 当父层不设置高度，而子层进行了float，由于父层是标准流，会不认识子层的存在，因此高度

会自动变成0.因此高度会自动变成0.解决办法一是在父层里面，最后一个子层后面加一个块状元素，

而后给这个块元素清楚浮动；二是给父层进行浮动，让它认识子层，高度会儿自动撑开。

更多相关文章...