指定した範囲内に画像を上下中央に配置
投稿日:
divなどで指定した部分に、画像を配置
上下中央にする方法は他にもありますが、
今回は、『position』を使ってみます。
html
<div class="divbox"> <img src=xxxxx.jpg alt="xxxx" > </div>
css
.divbox{ position: relative; width:500px; height:300px; overflow:hidden; } .divbox img{ position: absolute; top: 50%; left: 0%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);
デモ↓

関連記事
-
-
WordPressでフォトギャラリーを作るのに3つのプラグインを入れてみた
プラグインを使って簡単にフォトギャラリー WordPressの固定ページ、投稿ページ、カスタム投稿ページに写真を並べて掲載するフォトギャラリーページは、プラグインを使って簡 …