WEB DESIGN

簡単コピペCSSのみ!画像を枠に合わせて中央にトリミングする方法

バラバラの大きさの画像を横並びにする時に不揃いな印象を与えてしまうのは嫌!

でも一枚一枚画像加工ソフトでトリミングなんてできない・・・

そんな時にこの簡単コピペCSSが役に立ちます。

 

基本のコード

overflow: hidden; 以外のコードは自由に変更可能です。

クラス名などについても任意のものを使用してください。

 

今回使用する画像

チェリー

 

画像をそのまま中央だけトリミングする方法

チェリー

画像を横幅いっぱいに表示する方法

チェリー

画像を縦幅いっぱいに表示する方法

チェリー
関連タグ
ページトップへ戻る