5

ブートストラップ グリッドに関するチュートリアルを見つけましたが、bootstrap1.x で書かれています。今度は、bootstrap3 を使用して同じ効果を実現したいと考えています。ドキュメントには、 .media-gridの代わりに.img-thumbnailを使用すると書かれていますが、まだ機能していないようです。私が欲しいのは次のようなものです: ここに画像の説明を入力

1.x バージョンは次のとおりです。

<ul class="media-grid">
            <li>
                <a href="#">
                    <img src="http://placehold.it/290x200" />
                </a>
            </li>
            <li>
                <a href="#">
                    <img src="http://placehold.it/290x200" />

                </a>
            </li>
            <li>
                <a href="#">
                    <img src="http://placehold.it/290x200" />
                </a>
            </li>

    <!-- row of 4 thumbnails -->
            <li>
                <a href="#">
                    <img src="http://placehold.it/210x140" />
                </a>
            </li>
            <li>
                <a href="#">
                    <img src="http://placehold.it/210x140" />
                </a>
            </li>
            <li>
                <a href="#">
                    <img src="http://placehold.it/210x140" />
                </a>
            </li>
            <li>
                <a href="#">
                    <img src="http://placehold.it/210x140" />
                </a>
            </li>       

        </ul><!-- end media-grid -->
4

2 に答える 2

0
<div class="container">
<div class="row">
    <div class="col-xs-4">
       Some Image
    </div>
    <div class="col-xs-4">
        Some Image
    </div>
    <div class="col-xs-4">
       Some Image
    </div>
    <div class="col-xs-3">
       Some Image
    </div>
    <div class="col-xs-3">
       Some Image
    </div>
    <div class="col-xs-3">
       Some Image
    </div>
    <div class="col-xs-3">
       Some Image
    </div>
</div>

于 2016-12-17T08:08:25.817 に答える