創(chuàng)建網(wǎng)頁時(shí)，主欄和側(cè)欄是常見的布局方式。主欄通常用于展示主要內(nèi)容，而側(cè)欄則用于展示相關(guān)信息、鏈接、廣告等內(nèi)容。在CSS中，我們可以使用不同的布局方式來實(shí)現(xiàn)主欄和側(cè)欄的布局。 一種常見的方式是使用浮動和清除浮動。我們可以為主欄和側(cè)欄分別設(shè)置浮動方向，同時(shí)使用清除浮動來防止對后續(xù)元素的影響。下面是一個(gè)示例：

<div class="container">
<div class="main-column">
<p>這里是主欄內(nèi)容</p>
</div>
<div class="sidebar">
<p>這里是側(cè)欄內(nèi)容</p>
</div>
<div class="clr"></div>
</div>

在上面的例子中，我們?yōu)橹鳈诤蛡?cè)欄分別設(shè)置了寬度和浮動方向。為了防止浮動對后續(xù)元素造成影響，我們還設(shè)置了一個(gè)空的clr元素，使用clear屬性來清除浮動。 另一種常見的方式是使用flex布局。flex布局是CSS3中新增的一種布局方式，它可以讓我們更方便地實(shí)現(xiàn)不同的布局方式，包括主欄和側(cè)欄的布局。下面是一個(gè)示例：

<div class="container">
<div class="main-column">
<p>這里是主欄內(nèi)容</p>
</div>
<div class="sidebar">
<p>這里是側(cè)欄內(nèi)容</p>
</div>
</div>

在上面的例子中，我們?yōu)槿萜髟O(shè)置了display:flex，表示使用flex布局。然后我們分別設(shè)置了主欄和側(cè)欄的寬度，由于使用了flex布局，它們會根據(jù)寬度比例自動排列，不需要使用浮動和清除。 總的來說，使用浮動和清除浮動或者flex布局都可以實(shí)現(xiàn)主欄和側(cè)欄的布局。在實(shí)際開發(fā)中，我們可以根據(jù)具體情況選擇合適的方式來實(shí)現(xiàn)布局。