abstract：float:left ,right; 一但浮動起來,就是脫離文檔流.與本頁面無關(guān)系,簡單說就像是飄起來一樣!形成另一層次,本頁面部分就會被護(hù)蓋,當(dāng)本頁面浮動起來時(shí)需要左右移動.<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"
float:left ,right; 一但浮動起來,就是脫離文檔流.
與本頁面無關(guān)系,簡單說就像是飄起來一樣!
形成另一層次,本頁面部分就會被護(hù)蓋,當(dāng)本頁面浮動起來時(shí)需要左右移動.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CSS中的浮動</title>
<style type="text/css">
ul li{
width: 100px;height:50px;background-color: lightskyblue;line-height: 50px;text-align: center;
margin: 0px 2px;list-style: none;
float: left;
}
.box1{
width: 100px;height: 100px;background-color: green;margin: 0px 2px;text-align: center;
float: right;
}
.clear{
clear: both;
}
</style>
</head>
<body>
<ul>
<li>楊海諾</li>
<li>唐果</li>
<li>楊海言</li>
<li>楊天琦</li>
<li>唐文杰</li>
</ul> /*清除僅僅只是演示*/
<div class="clear">清除</div>
<div class="box1">唐果</div>
<div class="box1">楊海言</div>
<div class="box1">楊天琦</div>
<div class="box1">唐文杰</div>
</body>
</html>
Correcting teacher：查無此人Correction time：2019-05-21 09:18:20
Teacher's summary：完成的不錯。浮動在移動端用到的比較多。繼續(xù)加油。