前提・実現したいこと
Chromeブラウザの拡張css(stylus)を使い、画像ページ一覧の大きさを一括変更したいです。
① 横の画像の比率を一括で105%にリサイズして表示したいです。
② さらに画像はウィンドウの縦にフィットするようにしたいです。
発生している問題・エラーメッセージ
- 画像のアス比を固定すると他の違う比率の形の画像も一括して同じになってしまう。
例:比率4:3の画像A と 比率3:5の画像B
失敗なケース→ 一括でA、Bともに5:4
成功なケース→ Aの大きさ(縦100%横105%),Bの大きさ(縦100%横105%)
さらにウィンドウの縦の大きさに合わせる。
初心者なので詳しい方法がわからず困っております。
サンプルでcodepenに問題を載せておきました。それぞれ形の違う画像を一括で5%ずつ横に引き延ばすことはできますか?
どなたか優秀な方、ご回答よろしくお願いいたします。
#####ソースはcodepenのサイトにあります
該当のソースコード
- HTML <img src="https://i.imgur.com/38wwRpG.jpg"></img> <img src="https://i.imgur.com/3eKIG7k.jpg"></img> - CSS img { height: 100vh; }
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。