使用最大設備寬度調整大小時如何隱藏圖像？

Question

當我在移動設備上查看時，需要使img消失

 <div id="art">
<img src="../images/canO.jpg" alt="" width="500" height="500"/>
</div>

@media screen and (max-device-width:450px) {...}}

Answer 1

使用此媒體查詢。

 @media screen and (max-device-width:450px) { #art img{ display:none; } } 

我不明白你在問什么。 如果不是您需要的解決方案，請進一步解釋您的問題。 :) :)

Answer 2

對不起，匆匆我想寫這樣的DEMO

@media screen and (max-width:450px){
    #art img{
        display:none;
    }
}

or

   @media screen and (max-width:450px){
        #art img{
             visibility: hidden;
        }
    }

Answer 3

你是這個意思？

@media screen and (max-device-width:450px){
    #art img{
        display:none;
    }
}

Answer 4

@media screen and (max-device-width:450px) {  .art img { display: none !important;} 

Answer 5

您可以隱藏整個div #art { display:none; } #art { display:none; }或向圖像添加一個類。 另外，也可以使用#art img { display:none; } #art img { display:none; }

我只會使用屏幕寬度，如下所示：

@media screen and (max-width:450px) {   
  #art {         
     display:none;
  } 
}