CSS浮動是一種重要的布局方式，它可以使元素左右移動，達(dá)到頁面元素排列的效果。下面我們來看一個簡單的CSS浮動小例子。
<html>
<head>
<title>CSS浮動小例子教學(xué)</title>
<style>
.box {
float: left;
margin-right: 20px;
width: 100px;
height: 100px;
background-color: #ff9;
}
</style>
</head>
<body>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
</body>
</html>上面的例子中，我們定義了一個class為“box”的div元素，通過float屬性使其左側(cè)對齊，并設(shè)置一個20px的margin-right值，使它和其他元素保持一定的間距。
在HTML中，我們分別添加了三個class為“box”的div元素，它們會依次浮動在左側(cè)，并呈現(xiàn)出同樣的樣式，實(shí)現(xiàn)了左側(cè)一字排開的效果。
通過這個小例子，我們可以看到CSS浮動的使用方法和作用，這也是在實(shí)際網(wǎng)頁設(shè)計(jì)和布局中常常用到的技巧！