CSS之清除浮动clear

来源:互联网 发布:宇多田光知乎 编辑:程序博客网 时间:2024/04/30 11:51
<!DOCTYPE html><html><head><meta charset="UTF-8"><title></title><style type="text/css">.box1{height: 100px;width: 100px;background-color: red;float: left;}.box2{height: 200px;width: 200px;background-color: yellowgreen;/* * 由于受到box1浮动的影响,box2和box3整体向上移动了100像素 * 有时我们希望清除浮动元素对当前元素的影响 * clear可以用来清除其他浮动元素对当前元素的影响 * 可选值: * 1、none 默认值没影响 * 2、left 清除左侧元素对当前元素的影响 * 3、right  清除右侧元素对当前元素的影响 * 4、both  清除两侧元素对当前元素的影响 * 清除对他影响最大的元素的影响 *//*clear: left;*/float: right;}.box3{height: 300px;width: 300px;background-color: yellow;clear: right;}</style></head><body><div class="box1"></div><div class="box2"></div><div class="box3"></div></body></html>

原创粉丝点击