画像のブロックと高さが表示されない

Question

したがって、画面の解像度が740ピクセル未満になると、画像のサイズが自動的に変更されます。 このコードは@mediaの外にあります。

header img { 
 
    display: block; 
 
    height: 150px; 
 
    margin: auto; 
 
} 
 

 
@media screen and (max-width: 740px) { 
 
    header img { 
 
    display: block; 
 
    width: 100%; 
 
    height: auto; 
 
    } 
 
}

<header> 
 
    <img src="https://images.vexels.com/media/users/3/137694/isolated/lists/35e10823069d1767521320dc34475465-triangle-logo-geometric.png"> 
 
</header>

このコードは動作しません！どうして？私がchrom devツールのコードをチェックすると、width:100%;以外のこれらのプロパティは削除されます！

Answer 1

最初の定義はデフォルトのスタイルです。スクリーンスタイルを適用するには重要です。

@media screen and (max-width: 740px){ 
    header img{ 
     height:auto !important; 
    }