隱藏沒有其餘內容的DIV背景圖像

所以我的用例是我有一個大的背景圖像和一些其他文本里面的div的div。在我的CSS文件中，我有一個最大寬度的媒體查詢，所以低於這個寬度圖像應該消失。隱藏沒有其餘內容的DIV背景圖像

我已經嘗試了兩種可見性：隱藏和背景圖像：無，但在這兩種情況下，文本也消失。

有沒有辦法讓其他divs消失？或者構建這種結構以實現上述目標的另一種方法？

HTML：

<div id="teaser"> 
    <span id="teaser-text"> Text </span> 
    <div id="attributes"> Some Text</div> 
</div>

CSS：

#teaser { 
    width: 100%; 
    height: 0; 
    padding-top: 66.44%; 
    background-image: url('/static/main/freude2_bright1.jpg'); 
    background-size: contain; 
    position: relative; 
    color: white; 
    margin-bottom: 20px; 
}

非常感謝！ :)

來源

2017-01-04 munzwurf

顯示你的div代碼，並顯示你的CSS請。 – Creator

如果你想要的東西只顯示當尺寸大於....你需要使用最小寬度 – Creator

#teaser在白色背景上？如果是這樣，您的文字可能不會消失，但在您移除圖像後可能會變白。

嘗試：

@media all and (max-width:480px) { 
    #teaser { 
    background-image: none; 
    color: #000; 
    } 
}

來源

2017-01-04 23:58:58 livinzlife

哇，你是對的。 - 我現在覺得很愚蠢。非常感謝。 :) – munzwurf

如果我理解正確，你想刪除一個div的背景圖像（或者顏色？）但不影響其中的其他內容？

.main-div { 
    background-color: none; 
    background-image: none; 
}

來源

2017-01-04 23:53:45 oompahlumpa

隱藏沒有其餘內容的DIV背景圖像

回答

相關問題