幫助，手機螢屏上的標題橫幅不完整
.imgbanner{
height: 200px;
max-width: 100%;
margin-top: -70px;
background-size: cover;
background-position: center;
background-image: url('https://i.imgur.com/fKnCN5Z.png');
}<div class="imgbanner">
</div>
我怎樣才能讓它水平顯示得很好？
實圖：https: //i.imgur.com/fKnCN5Z.png 1024x312px
uj5u.com熱心網友回復：
嘗試洗掉寬度和邊距。您也可能不想設定固定高度，因為這會在較小的螢屏上裁剪您的影像。像這樣，在較小的螢屏上查看時，影像中的文本可能不可讀。
.imgbanner {
height: 200px;
/* max-width: 100%; */
/* margin-top: -70px; */
background-size: cover;
background-position: center;
background-image: url('https://i.imgur.com/fKnCN5Z.png');
}<div class="imgbanner">
</div>uj5u.com熱心網友回復：
您應該洗掉 max-width 和自定義高度屬性，因為這會裁剪您的背景影像或嘗試添加屬性 background-repeat:no-repeat;
.imgbanner {
height: 200px;
background-size: cover;
background-position: center;
background-image: url('https://i.imgur.com/fKnCN5Z.png');
background-repeat: no-repeat;}
<div class="imgbanner"></div>
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/329282.html