responsive-design - 流体イメージのロールオーバー フェード

Question

Fluids images で構成されるギャラリーを使用してレスポンシブ サイトを作成しています。このためには、css img {max-width: 100%;}を使用する必要があります。また、ホバー時にフェード効果が必要です。

誰にもこれに対する解決策がありますか？

これまでのところ、私が試したすべてのソリューションは、css img {max-width: 100%;} では機能しません。

ご助力ありがとうございます！

Answer 1

最大幅とともに画像幅も定義します。そしてそれはピクセルかemでなければなりません。max-widthまたはmin-widthを％で保持する必要はありません。ブラウザは、元の幅または高さの値からレンダリングします。として

これは例えばです。

img{
    width:50%;
    height:30%;
    max-width:300px;
    min-height:100px;
    }

そして、すべての画像はビューポートで柔軟になります。