在前端開發(fā)中，CSS是不可或缺的一部分。它可以讓網(wǎng)頁(yè)看起來(lái)更美觀，并且還有一個(gè)很重要的作用，就是布局。
正如大家所知道的，網(wǎng)頁(yè)布局很重要。一個(gè)好的布局不僅可以讓網(wǎng)頁(yè)看起來(lái)更好看，還可以提高用戶的體驗(yàn)。
那么，CSS中用什么做布局呢？
1. 相對(duì)定位
相對(duì)定位是指元素相對(duì)于其正常位置進(jìn)行移動(dòng)。例如：
```
p {
position: relative;
left: 10px;
top: 10px;
}
```
這段代碼會(huì)把段落向右和向下移動(dòng)10像素。
2. 絕對(duì)定位
絕對(duì)定位是指元素相對(duì)于其最近的非“static”（默認(rèn)值）定位祖先元素進(jìn)行定位。例如：
```
img {
position: absolute;
left: 0;
top: 0;
}
```
這段代碼會(huì)把圖片相對(duì)于它的父元素左上角定位。
3. 浮動(dòng)
浮動(dòng)是指元素向左或向右靠，直到它碰到了它父元素的邊界為止。例如：
```
div {
float: left;
}
```
這段代碼會(huì)把div元素向左浮動(dòng)。
4. 彈性盒子布局
彈性盒子布局是CSS3中新增的一個(gè)重要布局方式，通過(guò)設(shè)置元素的display屬性為“flex”實(shí)現(xiàn)。例如：
```
.container {
display: flex;
justify-content: center;
}
```
這段代碼會(huì)把.container元素的子元素在容器中居中對(duì)齊。
總結(jié)
在CSS中，相對(duì)定位、絕對(duì)定位、浮動(dòng)和彈性盒子布局是最常用的布局方式。要根據(jù)不同的需求選擇最合適的布局方式，并靈活運(yùn)用它們，才能達(dá)到最好的布局效果。
下一篇css中梯形的原理