-1

有沒有一種方法可以使我的width與我的navigation bar的width相同。問題是我正在處理原始尺寸爲497 x 298px的圖像，但爲了使圖像伸展整個頁面寬度，同時在兩側仍然有margins的10px，我必須設置width: 98.4%。有沒有辦法讓我的圖像等於導航欄的大小？

此外，由於某些原因，當我將ul設置爲width 100%時，導航時間太長，如果我將其設置爲50％，則導航時間太長，僅適用於正常的桌面屏幕。所以目前它們的長度都是相同的，但是當我調整頁面大小時，它們開始與我設置的規則下的ul元素不同步。

ul { 
 
    display: block; 
 
    max-width: 100%; 
 
    list-style-type: none; 
 
    margin: 10px 10px 0 10px; 
 
    padding-left: 32%; 
 
    padding-right: 25%; 
 
    text-align: center; 
 
    overflow: hidden; 
 
    background-color: #F25f70; 
 
    font-family: "Oswald", sans-serif; 
 
    border-bottom: 2px solid rgba(0, 0, 0, 0.15) 
 
} 
 
img { 
 
    width: 98.4%; 
 
    height: 500px; 
 
    margin-left: 10px; 
 
    margin-right: 10px; 
 
    object-fit: cover; 
 
}

來源

2016-07-16 Shade

你應該只是包裝在一個<div>您的導航。給它100％的寬度。然後指定一個background-image到您的<ul>，並使98％的寬度。包括這些背景屬性

-webkit-background-size: cover; 
-moz-background-size: cover; 
-o-background-size: cover; 
background-size: cover;

我創建了一個

DEMO HERE

woohooo移動到卡利在一個星期！所以我以卡利爲主題。

注意：我使用的圖像與您的文章中指定的尺寸相同。您也可以退房background-size properties at w3schools

來源

2016-07-16 02:29:08 Patrick

有沒有辦法讓我的圖像等於導航欄的大小？

回答

DEMO HERE

相關問題