0

私のオンラインショップには様々な商品があります。サイズ変更後の 3 つの製品写真があるとします。

100 x 20
100 x 100
100 x 180

100 x 180 は、製品のウィンドウに使用できる最大サイズです。商品を完璧に配置するには、これら 3 つの画像すべてを 100 x 180 のウィンドウに収める必要があります。これはそれほど難しくありません。

<div class="products" style="height: 180px;">
 <div class="product1">
   <img src="prod1.jpg" />
 </div>
 <div class="product2">
   <img src="prod2.jpg" />
 </div>
 <div class="product3">
   <img src="prod3.jpg" />
 </div>

問題は、これらの画像がすべて上部に配置されていることです。テーブルと同じように、すべてを MIDDLE に揃える必要があります。テーブルでこれを簡単に行うことができますが、CSS で行う方法についてはわかりません。それは CSS と同じくらい単純ですか、それともこのようなもののための気の利いた JQuery プラグインはありますか?

4

1 に答える 1

0

.products div { line-height: 180px; }

…理想的には、単なる div ではなく何らかのリストを使用する必要があります。

于 2012-04-07T06:58:29.893 に答える