四行兩列CSS是一種經典的網頁布局方式,它可以將內容劃分成兩列,使得頁面看起來更加整齊美觀。下面是一個基本的四行兩列布局代碼:
.container { display: flex; justify-content: space-between; } .left { width: 50%; } .right { width: 50%; }
在這段代碼中,我們首先定義了一個名為container的div元素,使用flex屬性將其設置為一個具有彈性的容器。justify-content屬性被設置為space-between,這樣左右兩列之間就存在間隔。接著,我們給左右兩個子元素分別加上了.left和.right的類名,并設置寬度為50%,使得它們可以各占一半寬度。
最后,在HTML中嵌套兩個div元素,分別添加上.left和.right類名,把需要放在左側的內容放在左側的div中,右側同理。
四行兩列CSS是一種簡單易用的布局方式,可以幫助我們更好地呈現網頁內容。
上一篇四分之一圓css怎么寫
下一篇四級樹狀css