CSS中的左右分欄是一種常見的設計方法,可以有效地將頁面分割成兩列,并在不同的列中顯示不同的內容。下面就是一個簡單的CSS左右分欄代碼。
<style> .left { width: 30%; float: left; } .right { width: 70%; float: left; } </style> <div> <div class="left"> <p>這是左側欄的內容</p> </div> <div class="right"> <p>這是右側欄的內容</p> </div> </div>
上面的代碼定義了兩個CSS類:left和right。left類占據了總寬度的30%,右浮動;right類占據了總寬度的70%,也右浮動。在HTML代碼中,使用<div>標簽將頁面分成了兩個部分,并分別指定了left和right類。
需要注意的是,左右分欄中的內容應該按照自己的需求進行設置,可以放上導航欄、文章內容、廣告等等。在設計時,要將兩列的寬度合理地分配,以達到更好的視覺效果。