0

私はWordPressサイトに取り組んでいますが、どんなに頑張っても理解できないことがあります. これ ( http://www.elegantthemes.com/gallery/origin/ )に似たグリッドが必要ですが、もっと似ています: ( http://themeforest.net/item/hercules-portfolio-business-wordpress-theme /full_screen_preview/5124743 )。Hercules テーマでは、グリッドがページの上部にのみあることがわかります。ページの真ん中に似たようなことをしたいです。残念ながら、その機能を得るためにテーマを切り替えることはできません。それで、自分のバージョンを作成する方法を知りたかったのです。誰かが私を正しい方向に向けることができますか?

Ps グリッドは派手なズーム アニメーションを持つ必要はなく、リンク可能である必要さえありません。4x2 のグリッドのような静的な写真です。画像間の間隔、パディング、またはマージンはありません。そのテーマのデザイナーに連絡したところ、それはプラグインではないとのことでした。カスタムCSS3です。彼はそれ以上役に立ちませんでしたが:/

4

1 に答える 1

1

順序付けられていないリストを使用して画像を含め、リスト項目をフロートさせ、25% の幅を適用します。レスポンシブ レイアウトの場合、画像には幅 100%、最大幅 100%、高さ: auto が必要です。アップロードする画像は、同じ高さの寸法である必要があります (または、リスト アイテムに固定の高さを設定することもできますが、一部の画像コンテンツが失われるリスクがあります)。

ul#picture_grid {

list-style: none;
width: 100%;
overflow: hidden;

}

#picture_grid li {

float: left;
width: 25%;

}

#picture_grid img {

display: block;
width: 100%;
max-width: 100%;
height: auto;

}
于 2013-10-23T00:25:39.370 に答える