Bootstrap - 缩略图未水平对齐

时间:2015-12-13 13:29:50

标签: css asp.net twitter-bootstrap

我正在学习bootstrap,我正在使用缩略图,当我放置图像时,它不会水平对齐。但是,如果我只使用字幕,它会正确对齐。当我检查其他问题时,他们说我应该将图像放入div标签,我这样做了,但它没有正确对齐。任何帮助,将不胜感激 对不起,我的英语不行。

我的代码:

<!-- beginning of row 1-->
        <div class="row">

        <!-- beginning of thumbnail 1-->
            <div class="col-lg-4">
        <div class="thumbnail">
            <img src="img/h1.jpg" />
            <div class="caption">
                <h3>Lorem</h3>
                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nemo deserunt, minima quisquam nesciunt, mollitia doloribus minus rem consectetur autem nobis ab vel assumenda perspiciatis quae quasi sunt eius, reiciendis expedita!</p>
                <asp:Button runat="server" Text="Learn More" CssClass="btn btn-lg btn-primary"/>
            </div>
        </div>
                </div>
        <!-- end of thumbnail 1 -->

        <!-- beginning of thumbnail 2-->
            <div class="col-lg-4">
        <div class="thumbnail">
            <img src="img/h2.jpg" />
            <div class="caption">
                <h3>Ipsum</h3>
                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nemo deserunt, minima quisquam nesciunt, mollitia doloribus minus rem consectetur autem nobis ab vel assumenda perspiciatis quae quasi sunt eius, reiciendis expedita!</p>
                <asp:Button runat="server" Text="Learn More" CssClass="btn btn-lg btn-primary"/>
            </div>
        </div>
                </div>
        <!-- end of thumbnail 2 -->

        <!-- beginning of thumbnail 3-->
            <div class="col-lg-4">
        <div class="thumbnail">
            <img src="img/h3.jpg" />
            <div class="caption">
                <h3>Dolor</h3>
                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nemo deserunt, minima quisquam nesciunt, mollitia doloribus minus rem consectetur autem nobis ab vel assumenda perspiciatis quae quasi sunt eius, reiciendis expedita!</p>
                <asp:Button runat="server" Text="Learn More" CssClass="btn btn-lg btn-primary"/>
            </div>
        </div>
                </div>
        <!-- end of thumbnail 3 -->

            </div>
        <!-- end of row 1-->

This is the image of the thumbnail

0 个答案:

没有答案