@media only screen and (max-width:767px) {
body { background: none; padding-bottom: 0px; }
.postcode_wrap { height: auto; background: url(../images/index_page_bg_2.jpg) left top repeat-y !important; background-size: 100% 100% !important; padding-bottom: 0%; }
.post-code-right-block, .post-code-left-block { height: auto !important; }
.bistro_logo { padding-top: 40px !important; }
.bistro_logo img { max-width: 100%; }
.postcodeform { top: 10% !important; width: 100%; }
.postcodeform input.pcinput { padding: 0; margin: 0; font-size: 1em !important; }
.post-code-right-block img { max-width: 100%; }
.postcode-right-block-content, .postcode-left-block-content { padding-top: 20px; }
.post-code-app-icons-wrapper > .first img { height: 60px; width: 125px; float: right; }
.post-code-app-icons-wrapper > .second img { height: 35px; width: 125px; float: right; }
#wh-widget-send-button.wh-widget-left { left: 10px !important; bottom: -10px !important; }
.appBtnRow { margin: 28px 15px 0px; text-align: center; }
.resim { width: 332px !important; }
這會導致底部白色區域問題。我怎樣才能解決這個問題？
底白問題
uj5u.com熱心網友回復：
您必須確保您的影像尺寸適合您定位的設備格式，并根據設備格式呈現正確的影像。
或者您可以允許影像拉伸（不建議）以適合所有格式
要么
您必須在調整大小時選擇影像的中心位置，同時保持其比例，如果您的影像是 1920*1080，那么在移動格式上您只會看到一半左右，這是您必須選擇哪一部分的地方您要顯示的影像。
body, html {
height: 100%;
margin: 0;
}
.postcode-rightblock img {
/* Set a specific height */
height: 100%;
/* Position and center the image to scale nicely on all screens */
background-position: center;
background-repeat: no-repeat;
background-size: cover;
position: relative;
}轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/441408.html
標籤：css
下一篇：將文本顏色設定為反轉背景顏色