jquery - 我怎样才能使这张图片始终位于div的中心？

Question

我正在使用 bootstrap 来构建我自己的网站。我的 PAGE1 分为 3 列。在第三列中，我想在中间放置一张图片，但只能水平放置。我想知道为什么“margin-left:auto;”和“右边距:自动；”不要做这份工作。请帮助我将这张图片居中。

这是相关代码:

HTML:

<div id="PAGE1" class="container-fluid">
        <div id="backgroundDiv1"></div>
        <div id="backgroundDiv2"></div>
        <div style="height:100%" class="row">
            <div id="reihe1"class="col-md-3"></div>
            <div id="reihe2" class="col-md-3"></div>
            <div id="reihe3"class="col-md-6">
                <div id="googleDiv" data-toggle="tooltip" data-placement="left" title="google+"><img id="googleplus" src="google+.png"></div>
                <div id="titel">
                    <p>*******</p>
                    <p>*******</p>
                    <p id="designer">*********</p>
                    <img src="pfeil.png" id="arrow">
                </div>
            </div>
        </div>
    </div>

CSS:

#PAGE1{
    overflow:hidden;
}
#backgroundDiv1{
    position: absolute;
    background-color:#848484;
    width: 1200px;
    height: 500px;
    z-index: 1;
    bottom:0;
    border-top-right-radius:700px;
    border-top-left-radius:200px;
    border-right: solid black 20px; 
}
#backgroundDiv2{
    position: absolute;
    background-color:#742B22;
    width: 800px;
    height: 400px;
    z-index: 2;
    bottom:0;
    border-top-right-radius:400px;
    border-top-left-radius:200px;
    border-right: solid black 20px;
}
#titel{
    position: relative;
    width:100%;
    height:100%;
    text-align:center;
    font-size:450%;
    color:#222222;
    padding-right: 50px;
    padding-top: 100px;
}
#designer{
    font-size: 0.6em!important;
    padding-left: 300px;
}
#arrow{
    margin-left: auto;
    margin-right: auto;
}

Answer 1

它不起作用，因为未声明图像的宽度。 Margin:auto 仅在对象的宽度已知时起作用，通过 width:Npx CSS 标记或在 img 标记的情况下，宽度属性。