css之浮动以及溢出的处理

来源：互联网发布：node如何指定版本安装编辑：程序博客网时间：2024/06/06 02:39

本篇主要介绍浮动属性、清除浮动以及对于溢出的处理方式。

<!doctype html><html><head><title>Div+Css布局(浮动以及溢出处理)</title><meta charset="utf-8"><style type="text/css">body{padding:0;margin:0;}.div{width:960px;height:600px;margin:0 auto;  /*居中处理*/background-color:#f1f1f1;}.left{float:left;  /*float:left是左浮动*/width:260px;height:460px;background:#ccc;}.right{float:right;width:690px;height:460px;background:#ddd;}.clear{clear:both;  /*clear:both清除浮动*/}.bottom{margin-top:10px;height:200px;width:960px;background:red;}.introduction{width:260px;height:120px;background:red;overflow:auto;  /*overflow溢出的处理方式*/}</style></head><body><div class="div"><div class="left"><div class="introduction">今天天气真好啊！今天天气真好啊！今天天气真好啊！今天天气真好啊！今天天气真好啊！<br />今天天气真好啊！<br />今天天气真好啊！<br />今天天气真好啊！<br />今天天气真好啊！<br />今天天气真好啊！<br />今天天气真好啊！<br />今天天气真好啊！<br /></div></div><div class="right"></div><div class="clear"></div><div class="bottom"></div></div></body></html>

0 0