[所有葉子都從樹枝上脫落的樹[1] [1]:https://i.stack.imgur.com/hfQGM.png
我試圖使影像適合內邊框的左下角和頂部,但不是右我只是希望它適合那個特定的空間。
這是我到目前為止所擁有的......
<section class="winter">
<div class="outside-border">
<div class="section-heading">
<h2>Winter</h2>
</div>
<div class="inside-border">
<div class="winter-image">
<a href="winter.html">
<img src="assets/images/winter.jpg" alt="Winter Image">
</a>
</div>
<div class="section-content">
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Impedit dolore enim sequi dignissimos vel fugit
reiciendis minus voluptatem nostrum, at repellat odio libero cum eveniet officiis, cumque veritatis, qui
eaque.</p>
</div>
</div>
</div>
css
.outside-border{
border: 2px solid var(--winter-primary);
margin: auto;
max-width: 1000px;
background-color: white;
padding: 20px;
margin-bottom: 20px;
}
.section-heading{
width: 100%;
background-color: var(--winter-primary);
text-align: center;
}
.section-heading>h2 {
margin: 0;
}
.inside-border{
border: 2px solid var(--winter-primary);
display: flex;
align-items: center;
background-color: var(--winter-light);
}
.section-content{
background-color: var(--winter-light);
}
.winter-image{
display: inline-flex;
background-size: cover;
}
p{
margin-left: 1em;
text-align: center;
padding: 10px;
}
現在我只是一遍又一遍地說同樣的話,因為我是一個愚蠢的新手編碼器,在這個問題上遇到了麻煩。堆疊溢位說我需要添加更多單詞,因為我現在只有代碼。
uj5u.com熱心網友回復:
嘗試將邊距和填充設定為 0。希望這會有所幫助
.winter-image{
display: inline-flex;
background-size: cover;
margin: 0;
padding: 0;
}
轉載請註明出處,本文鏈接:https://www.uj5u.com/caozuo/459627.html
上一篇:為什么我的:nth-child()選擇器不能與::before一起使用
下一篇:父母身高和祖父母的位置
