CSS的浮动(一)
来源:互联网 发布:js 用法 编辑:程序博客网 时间:2024/05/18 04:54
浮动是css里面布局用的最多的属性。通过float属性实现,float有2个值,分别为left、right。表示左浮动和右浮动。
这里我们定义2个div,类名分别为“box1”和“box2”设置float:left。表示左浮动
.box1{
float: left;
width: 200px;
height: 200px;
background-color: yellowgreen;
}
.box2{
float: left;
width: 400px;
height: 400px;
background-color: skyblue;
}
显示在页面的效果如下:
可以看到通过浮动,两个元素并排了,并且两个元素都能够设置宽度、高度了。就不再分行内和块级元素了。我们称之为浮动的元素脱离了标准文档流。
可以举个例子来证明这个观点
同样是2个div
.box1{
float: left;
width: 200px;
height: 200px;
background-color: yellowgreen;
}
.box2{
width: 400px;
height: 400px;
background-color: skyblue;
}
box1有左浮动,box2没有左浮动,此时页面显示为:
0 0
- CSS的浮动(一)
- css盒子的浮动一
- CSS之浮动(一)
- CSS基础(一)清除浮动的几种方法
- CSS的浮动(二)
- CSS技巧(一):清除浮动
- CSS技巧(一):清除浮动
- CSS浮动与定位(一)
- css如何清除浮动(一)
- CSS技巧(一):清除浮动
- [CSS]CSS浮动float详解(一):标准文档流
- CSS float浮动的深入研究、详解及拓展(一)
- CSS float浮动的深入研究、详解及拓展(一)
- 兼容性好的overflow CSS清除浮动一例
- CSS float浮动的深入研究、详解及拓展(一)
- CSS float浮动的深入研究、详解及拓展(一)
- CSS float浮动的深入研究、详解及拓展(一)
- CSS:浮动元素(float)的认识
- C语言之预处理
- ajax回调json数组对象,jquery中$.each()循环解析
- SQL语句LIKE
- 字符串常量池及byte数据常量池
- 推荐大家使用的CSS书写规范、顺序
- CSS的浮动(一)
- 轮胎充气
- 函数实现判断素数并调用函数输出100以内所有素数
- 如何使用python进行社交网络分析
- 《JAVA与模式》之责任链模式
- Consul 服务注册与服务发现
- CSS初体验
- HDU3829-Cat VS Dog
- 牛客模拟一:DNA合成