引導列中的圖像未按預期呈現

Question

我正在為個人網站使用引導主題。 在聯系方式部分中，我試圖用我住的地方的圖像替換表格（主題隨附）。

問題在於圖像不能在頁面的中央渲染（窗體可以）：

這是表單的HTML：

            <div class="row">

            <div class="col-sm-6 col-sm-offset-3">

                <form id="contact-form" role="form">
                    <div class="ajax-hidden">
                        <div class="form-group wow fadeInUp">
                            <label class="sr-only" for="c_name">Name</label>
                            <input type="text" id="c_name" class="form-control" name="c_name" placeholder="Name">
                        </div>

                        <div class="form-group wow fadeInUp" data-wow-delay=".1s">
                            <label class="sr-only" for="c_email">Email</label>
                            <input type="email" id="c_email" class="form-control" name="c_email" placeholder="E-mail">
                        </div>

                        <div class="form-group wow fadeInUp" data-wow-delay=".2s">
                            <textarea class="form-control" id="c_message" name="c_message" rows="7" placeholder="Message"></textarea>
                        </div>

                        <button type="submit" class="btn btn-lg btn-block wow fadeInUp" data-wow-delay=".3s">Send Message</button>
                    </div>
                    <div class="ajax-response"></div>
                </form>

            </div>

        </div><!-- .row -->

Chrome開發者工具中的表單：

這是我的代碼的外觀：

            <div class="row">

                <div class="col-sm-6 col-sm-offset-3">
                    <img src="assets/images/staticmap2.png">
                </div>

            </div><!-- .row -->

Chrome開發人員工具中的圖片：

我嘗試過更改圖像的大小和不同的偏移大小都無濟於事。 我不知道該如何解決-有人可以幫忙嗎？

Answer 1

將班級center-block添加到圖像將應用margin:0 auto; 並將圖片放在其父div的中央。

<img class="center-block" src="assets/images/staticmap2.png">