浮动和清除浮动clear

原创 2019-03-04 15:13:11 146
摘要:<!DOCTYPE html><html><head> <meta charset="utf-8"> <title></title> <style type="text/css"> ul li{list-style: none;width: 100px;height: 40

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title></title>

<style type="text/css">

ul li{list-style: none;width: 100px;height: 40px;line-height: 40px;text-align: center;background-color: #ccc;margin:0px 1px;float: left; }

div{width: 200px;height: 200px;background-color: blue;float: left;}

.clear{clear: both;}

</style>

</head>

<body>

<ul>

<li>html</li>

<li>css</li>

<li>JavaScript</li>

<li>jquery</li>

<li>php</li>

</ul>

<div class="clear"></div>

<div>div1很好</div>

<div>div2很好</div>

<div>div3很好</div>

</body>

</html>


批改老师:灭绝师太批改时间:2019-03-04 15:41:03
老师总结:前端浮动是魔鬼,一定要记得清除浮动,否则会造成布局错误!

发布手记

热门词条