css2個div垂直排列

CSS可以輕松實現兩個div元素垂直排列。在這篇文章中，我們將介紹如何使用CSS來加強網頁的布局。

首先，我們先來創建一個HTML文件，并在文件中添加兩個

元素。在這個例子中，我們將使用class屬性來創建兩個矩形。代碼如下：

<div class="rectangle"></div>
<div class="rectangle"></div>

接下來，我們需要使用CSS樣式來控制這兩個元素的布局。我們將使用display和flexbox來垂直排列這兩個矩形。代碼如下：

.rectangle {
width: 100px;
height: 50px;
background-color: blue;
margin: 10px;
}
.container {
display: flex;
flex-direction: column;
}

現在，我們可以在HTML文件中將兩個

元素包裝在一個容器

元素中，并將該容器

元素的class屬性設置為“container”。這將允許我們使用flexbox來垂直排列這兩個矩形。代碼如下：

<div class="container">
<div class="rectangle"></div>
<div class="rectangle"></div>
</div>

現在，我們已經設置好了我們的布局，我們可以在瀏覽器中查看它。在這個例子中，兩個矩形將垂直排列，并且它們之間有一些外邊距。這個布局看起來簡單，但實際上，它使用了一些強大的CSS功能。

總之，CSS允許我們輕松地創建網頁的布局。在這篇文章中，我們介紹了如何垂直排列兩個

元素，并使用flexbox來控制它們的布局。這個技術可以用于任何網頁設計，它為我們提供了更多的布局控制。

色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看