CSS是前端開發中的一種必不可少的技術。在網頁設計中，左右兩列布局是經常用到的一種布局方式，它可以把網頁內容分為兩部分，一部分放置在左邊，一部分放置在右邊。下面我們來學一下如何使用CSS實現左右兩列布局。

<style>
.container {
width: 1000px;
margin: 0 auto;
}
.left, .right {
height: 300px;
box-sizing: border-box;
padding: 10px;
}
.left {
width: 700px;
float: left;
background-color: #f2f2f2;
}
.right {
width: 280px;
float: right;
background-color: #d9d9d9;
}
.clearfix:after {
content: "";
display: table;
clear: both;
}
</style>

如上所示，我們首先定義了一個名為container的class，用來設置整個布局的寬度及居中。其中，width屬性設置了布局的寬度，margin屬性用來實現水平居中。

接著我們定義了兩個class，分別用來設置左列和右列的樣式。其中，height屬性用來設置左右列的高度，box-sizing屬性用來設置內容區域的盒子模型，padding屬性用來設置左右列內部的間距。

然后，我們使用了float屬性來使左列和右列實現左右浮動布局。float屬性的取值可以是left或right，表示元素相對它的容器左側或右側浮動。

<div class="container clearfix">
<div class="left">
<p>這里是左側內容</p>
</div>
<div class="right">
<p>這里是右側內容</p>
</div>
</div>

最后，我們使用容器包裹左右兩列，通過clearfix class來清除浮動。這樣就完成了一個左右兩列布局。

總結起來，左右兩列布局使用float屬性來實現，通過包裹容器來實現布局的劃分。在實現布局時，我們還需要注意清除浮動，以避免出現布局錯亂等問題。