CSS浮动应用及清除

Original 2019-03-27 17:25:21 184
abstract:CSS浮动float的运用 float:left ,应用之后标签会脱离文档流,注意清除浮动<!DOCTYPE html><html><head><meta charset="UTF-8"><title>css 的浮动</title><style type="text/cs
CSS浮动float的运用 float:left ,应用之后标签会脱离文档流,注意清除浮动

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>css 的浮动</title>

<style type="text/css">

ul li{

list-style: none;

width:100px;

height:40px;

line-height: 40px;

text-align:center;

background:#ccc;

margin:5px 0;

float:left;


}

.box1{

width:200px;

height:200px;

border:1px solid red;

background-color: blue;

float:right;

}

.clear{

clear:both;

}

</style>

</head>

<body>

<ul>

<li>html</li>

<li>css</li>

<li>javascript</li>

<li>jquery</li>

<li>php</li>

</ul>

<div></div>

<div>div1</div>

<div>div2</div>

</body>

</html>



Correcting teacher:天蓬老师Correction time:2019-03-28 09:52:01
Teacher's summary:清除浮动并不是必须的, 除非后面的元素有影响

Release Notes

Popular Entries