0

多くの条件付きメディア クエリ ステートメントを含むスタイル シートがあります。iPhone の解像度から 1600px までの範囲です。ただし、条件付きの @media クエリ ステートメントが既に記述されているかどうかに関係なく、ブラウザー ウィンドウのサイズが変更されたときにサイズを変更するかのように、特定の div 流体内で img を作成したいと考えています。使ってみた

img { max-width: 100%}

しかし、それはまったく機能しません。ブラウザのウィンドウに関係なく、画像はそのまま残ります。効果的にするために、プロパティの最後に !important を追加し、iPhone の解像度から 1600px までのすべてのメディア クエリ ステートメント内に貼り付けましたが、機能しません。

既に作成されたメディア クエリに関係なく、このような効果を得るにはどうすればよいですか。ブラウザー ウィンドウが変更されたときに、特定の div 内で画像が柔軟になるようにします。

追加した

#inner_container img { max-width:100% !important; }

このスタイルシートの最後に

http://strongcodelabs.com/test/css/style.css

4

1 に答える 1

3

小さな画面用にサイズ変更するだけで、大きな画面で画像を拡大したくない場合は、これで十分です。

#inner_container  img{
    width: auto;
    max-width: 100%;
}

メディアクエリの外側に追加し、値がその後のスタイルによって上書きされないようにします!important。必要に応じて使用してください。

于 2013-07-06T06:56:47.887 に答える