html5和css篇有关浮动以及如何清除浮动

CSS样式如下:.box1{ float:left; width:200px; height:300px; background:#f00;}/* 设置div对象浮动靠左*/ .box2{ float:right;width:200px; height:300px;background:#0f0;}/* 设置div对象浮动靠右 */ .clear{ clear:both;}/*清除浮动*/html代码如下:
html5和css篇有关浮动以及如何清除浮动
浮动和盒状模型、定位是CSS重点和难点。浮动,就是让div样式层块,向左或向右(靠)浮动。
Float:left 靠左浮动;Float:right 靠右浮动;clear:both清除浮动,简单举例如下:
CSS样式如下:
.box1{ float:left; width:200px; height:300px; background:#f00;}/* 设置div对象浮动靠左*/ .box2{ float:right;width:200px; height:300px;background:#0f0;}/* 设置div对象浮动靠右 */ .clear{ clear:both;}/*清除浮动*/html代码如下:
<div class="divcss5"> <div class="box1">布局靠左浮动</div> <div class="box2">布局靠右浮动</div> <div class="clear"></div><!-- html注释:清除float产生浮动 --> </div>效果如下:

浮动利用好了,再结合相对定位,绝对定位,CSS排版基本上就能搞定了,细节的东西在实践中去体验吧。
2018-06-06
clear:both;不就可以吗2018-06-11
mengvlog 阅读 396 次 更新于 2025-12-19 01:33:34 我来答关注问题0
檬味博客在线解答立即免费咨询

CSS相关话题

Copyright © 2023 WWW.MENGVLOG.COM - 檬味博客
返回顶部