我有一個從 Contentful 嵌入到另一個頁面（BigCommerce/Shogun）的影像橫幅，但橫幅被切斷了。請參閱附加影像和 CSS。預先感謝您在
此處輸入圖片說明
padding: 15px 5px;
margin-bottom: 15px;
overflow: visible !important;
background-image: url("https://images.ctfassets.net/p62egiw5uahp/56FxF0pvFweTKNW0McKYgX/439a1dcdc828e8edeb05d2a75459f2a6/BF_desktop_11.24.jpg");
background-repeat: no-repeat;
background-size: cover;
display: flex;
flex-wrap: wrap;
justify-content: space-evenly;
align-items: center;<span id="clp-furniture-multiLinkBanner"><div style="padding: 15px 5px;margin-bottom: 15px;overflow: visible !important;background-image: url("//images.ctfassets.net/p62egiw5uahp/56FxF0pvFweTKNW0McKYgX/439a1dcdc828e8edeb05d2a75459f2a6/BF_desktop_11.24.jpg");background-repeat: no-repeat;background-size: cover;display: flex;flex-wrap: wrap;justify-content: space-evenly;align-items: center;"><div style="color: white; display: flex; flex-direction: column; text-align: center;"><a href="#" style="text-decoration: none;"><h4 style="color: black; font-size: 22px; line-height: 32px; margin-top: 0px; margin-bottom: 0px; text-transform: uppercase; font-family: NeutrafaceText-Demi;"></h4><h1 style="color: black; font-size: 68px; line-height: 68px; font-weight: normal; margin-top: 0px; margin-bottom: 5px; font-family: "Para Supreme Normal";"></h1><h4 style="color: black; font-size: 24px; line-height: 32px; margin-top: 8px; font-family: NeutrafaceText-Book; margin-bottom: 0px; white-space: pre-wrap;"></h4></a></div></div></span>uj5u.com熱心網友回復：
在 CSS 中，ID 選擇器“#clp-furniture-multiLinkBanner”應包含設定的寬度和高度屬性。為了在調整瀏覽器視窗的尺寸時增加一點回應能力，添加封面的背景位置屬性會有所幫助。
見下文：
#clp-furniture-multiLinkBanner {
padding: 15px 5px;
margin-bottom: 15px;
overflow: visible !important;
background-image: url("https://images.ctfassets.net/p62egiw5uahp/56FxF0pvFweTKNW0McKYgX/439a1dcdc828e8edeb05d2a75459f2a6/BF_desktop_11.24.jpg");
background-repeat: no-repeat;
background-position: cover;
background-size: contain;
display: flex;
flex-wrap: wrap;
justify-content: space-evenly;
align-items: center;
width: 100%;
height: 100vh;
}<span id="clp-furniture-multiLinkBanner"><div style="padding: 15px 5px;margin-bottom: 15px;overflow: visible !important;background-image: url("//images.ctfassets.net/p62egiw5uahp/56FxF0pvFweTKNW0McKYgX/439a1dcdc828e8edeb05d2a75459f2a6/BF_desktop_11.24.jpg");background-repeat: no-repeat;background-size: cover;display: flex;flex-wrap: wrap;justify-content: space-evenly;align-items: center;"><div style="color: white; display: flex; flex-direction: column; text-align: center;"><a href="#" style="text-decoration: none;"><h4 style="color: black; font-size: 22px; line-height: 32px; margin-top: 0px; margin-bottom: 0px; text-transform: uppercase; font-family: NeutrafaceText-Demi;"></h4><h1 style="color: black; font-size: 68px; line-height: 68px; font-weight: normal; margin-top: 0px; margin-bottom: 5px; font-family: "Para Supreme Normal";"></h1><h4 style="color: black; font-size: 24px; line-height: 32px; margin-top: 8px; font-family: NeutrafaceText-Book; margin-bottom: 0px; white-space: pre-wrap;"></h4></a></div></div></span>uj5u.com熱心網友回復：
橫幅影像大于您提供的“高度”。如果將內邊距更改為 140 像素，您將看到更多圖片。
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/359297.html
上一篇：如何使按鈕居中？