Bootstrap是一種流行的前端開發框架，它提供了許多有用的工具和組件，以幫助我們快速搭建漂亮且響應式的網頁。其中之一就是Bootstrap的div分列功能，可以讓我們在網頁中的不同部分進行合理的分割布局，實現更好的視覺效果和用戶體驗。
<div class="container"> <div class="row"> <div class="col-md-6">

這是第一列

</div> <div class="col-md-6">

這是第二列

</div> </div> </div>
在上述代碼示例中，我們使用了Bootstrap的容器（container）和行（row）來創建一個網頁的布局。在行內我們使用了兩個div來分別表示兩列內容。每一列使用了.col-md-6的類，代表這個列占據父容器的一半寬度。這樣，我們就實現了一個簡單的雙列布局。
接下來，我們可以使用更多的代碼案例來詳細說明Bootstrap的div分列功能。
<div class="container"> <div class="row"> <div class="col-lg-4 col-md-6">

這是第一列

</div> <div class="col-lg-4 col-md-6">

這是第二列

</div> <div class="col-lg-4">

這是第三列

</div> </div> </div>
在這個例子中，我們使用了不同的類來給不同的列指定寬度。col-lg-4代表大屏幕下占據四分之一寬度，col-md-6代表中等屏幕下占據一半寬度。這種方式可以幫助我們在不同的設備上實現自適應的布局。
<div class="container"> <div class="row"> <div class="col-lg-3">

這是第一列

</div> <div class="col-lg-9">

這是第二列

</div> </div> <div class="row"> <div class="col-lg-6">

這是第三列

</div> <div class="col-lg-6">

這是第四列

</div> </div> </div>
在這個例子中，我們使用了嵌套的行（row）和列（col）來實現更復雜的布局。第一行的第一列占據了三分之一的寬度，第二列占據了剩余的九分之八寬度。接下來的兩行分別是兩個等寬的列。
一下，Bootstrap的div分列功能是一個強大而靈活的工具，可以幫助我們快速實現網頁布局。我們可以通過設置不同的類來控制不同列的寬度，并且還可以使用嵌套的行和列實現更復雜的布局。這樣，我們可以為用戶提供更好的瀏覽體驗，并且能夠在不同的設備上自適應地顯示內容。
參考文章： - Bootstrap Grid System: https://getbootstrap.com/docs/4.6/layout/grid/