我正在嘗試制作像這張圖片一樣的網格模板。知道怎么做嗎？ 圖片
另外，我不想要圓形邊框，它們之間也沒有間隙。
謝謝 <3
uj5u.com熱心網友回復：
最簡單的方法是CSS-Grid。
由于您沒有提供任何嘗試，并且對于這樣簡單的任務似乎缺乏研究能力，我不會向您解釋以下代碼段的作業原理，而是向您介紹一些資源：
網格完整指南
MDN WebDocs 網格
body {
display: grid;
grid-template-columns: 4fr 1fr;
}
div:nth-of-type(1) {
grid-column: span 2;
}
/* for styling purpose only */
div {
border: 1px solid black;
min-height: 40vh;
}
div:nth-of-type(1) {
min-height: 20vh;
}<div></div>
<div></div>
<div></div>或者你也可以使用 Flexox
Flexbox 完整指南
MDN WebDocs Flexbox
body {
display: flex;
flex-wrap: wrap;
}
div:nth-of-type(1) {
width: 100%;
}
div:nth-of-type(2) {
width: 80%;
}
div:nth-of-type(3) {
width: 20%;
}
/* for styling purpose only */
div {
border: 1px solid black;
min-height: 40vh;
box-sizing: border-box;
}
div:nth-of-type(1) {
min-height: 20vh;
}<div></div>
<div></div>
<div></div>轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/353046.html
上一篇：活動下拉選單
下一篇：文本在css中懸停時保持隱藏？