定位
1.什么是定位：
表示的是元素在网页中的位置
2.定位的分类：
在css中，定位主要分为以下几类。
1，普通定位
2，浮动定位（重难点）
3，相对定位
4，绝对定位
5，固定定位
3，普通定位
下面注意看啦
普通流定位有被称为“文档流定位”。是页面中默认的定位方式。
典型的“流布局”。
特点：
1，每个元素都在页面中有自己的位置，并占据一定的空间。
2，每个元素都是从其父元素开始排列的。
3，每个元素都是从左到右，从上到下排列的。
浮动定位
1，将元素设置为浮动定位，元素将具备以下特点
1，浮动元素 会被排除在文档流之外，脱离文档流，那么元素将不再占据页面空间。
2，剩余未浮动元素会上前占位
3，浮动定位的元素会停靠在父元素的左边或者右边或者其他浮动元素的边缘上
4，浮动只能在当前行浮动
5，浮动解决的问题，让多个块级元素在一行内显示问题
2，语法：
属性：float
取值：
1，none 默认值，无任何浮动效果
2，left 浮动到左边，或者停靠在左边的边缘上
3，right 浮动到右边，或者停靠在右边的边缘上
3，浮动引发的一些特殊效果
1，如果父元素显示不下所有已经浮动的子元素的话，那么最后
一个将换行，但有可能卡住
2，元素一旦浮动起来之后，江变成块级元素。行内元素一旦浮动
就允许修改尺寸
3，元素一旦浮动起来之后，在未指定宽度的情况下，宽度将由
内容决定。主要针对块元素
4，文字，图片，行内元素将是采用环绕方式来排列的，是不会被
浮动元素压在底下的。
浮动
1.清除浮动
元素一旦浮动起来之后，要上前占位，有可能浮动元素压在底下。如果元素不想被压在底下面的话，则可以通过清除浮动影响的方式来解决问题。
1.语法
属性：clear
取值：
1.none
默认值，不做任何清除浮动操作
2.left
清除当前元素前面元素左浮动做带来的影响，即不会被前面元素左浮动而压在底下。
3.right
道理同上，清除的是右浮动
4.both
道理同上，清除当前元素前面元素任何一种浮动方式所带来的影响。
案例：
<!DOCTYPE html>
<meta charset="UTF-8">
<html>
<head>
<style>
#div1{
width: 100px;
height: 100px;
background-color: blue;
float: left; #左浮动
}
#div2{
width: 100px;
height: 100px;
background-color: black;
clear: left; #清除左浮动
}
</style>
</head>
<body>
<div id="div1"></div>
<div id="div2"></div>
</body>
</html>
239
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
