2017-11-16 5 views
0

画像のサイズをsrcset/sizes属性内の親要素のパーセンテージとして設定する方法はありますか?私は、ビューポートの絶対値またはパーセンテージとしてサイズを設定する方法しか見ていませんでした。サイズ属性内で親要素の割合としてimgサイズを設定する方法

上記のことが不可能で、相対的なimgの幅をグリッドで使用している場合、ブラウザにデバイスサイズに応じて異なるimg解像度をダウンロードする方法があるかどうかを示します?

ありがとうございました。

答えて

0

画像の幅をパーセンテージにすると、イメージは親要素の幅に縮小されます。

height: auto; 
width: 40%; 

異なる解像度を使用する場合は、@ mediaルールを使用できます。イメージがどこにあるのかを指定する空のdivを設定します。次に、@ mediaルールを使用して、CSSのさまざまな画面幅で背景イメージを変更します。画像は行くべきあなたのHTML内

:あなたのCSSドキュメントで

<div class="yourclass"></div> 

@media screen and (min-width: 630px) { 
    .yourclass { 
    background-image: url("yourpciture.png"); 
    } 
    } 

あなたは、各解像度変更のためにこれらのいずれかを作成する場合は、ときに誰か画像が変更されますしたいですそのウィンドウをドラッグするか、デバイスを変更したときに表示されます。最小幅であることを覚えておいて、最小の画面サイズを最大にするか、変更を上書きしてください。

+0

ありがとう、ありがとう。だから私はサイズの属性がこの場合に動作しないと思います。 – shmuelhonig

+0

size属性は入力タグの幅にのみ影響します。 – Nicapopolus

関連する問題