新成员即将来临。
我是HTML和CSS的新手。我是一名设计师,我对HTML和CSS感到惊讶,我正在研究div中位置元素的方法。最近我遇到了一些问题。我试图使元素适合上面的空格,但似乎有一条线划分了块的两个部分。这是一张图片来说明我正在经历的事情。
我的标记是:
<section style="max-width:470px; background-color:green;">
<div class="bloco1">
hello
</div>
<div class="bloco2">
hi
</div>
<div class="bloco3">
hey
</div>
<div class="bloco3">
I want this elements to fit those spaces above
</div>
<div class="bloco1">
I want this elements to fit those spaces above
</div>
<div class="bloco2">
I want this elements to fit those spaces above
</div>
CSS就是:
.block1 {
display:inline-block;
width:150px;
height:200px;
background-color:gray;
}
.block2 {
display:inline-block;
width:150px;
height:100px;
background-color:yellow;
}
.block3 {
display:inline-block;
width:150px;
height:180px;
background-color:blue;
}
所以,我试图搞砸位置,但效果并不理想。我该怎么办?