我有一个div标签,宽度设置为800像素。当浏览器宽度大于800像素时,它不应该拉伸div,但应该将它带到页面的中间。


当前回答

使用下面的代码将div框居中:

.box-content { 保证金:汽车; 上图:0; 右:0; 底部:0; 左:0; 位置:绝对的; 宽度:800 px; 身高:100 px; 背景颜色:绿色; } < div class = " box-content”> < / div >

其他回答

旧代码中其他一些预先存在的设置将阻止div页面居中L&R:

隐藏在外部样式表链接中的其他类。 其他类嵌入到像img这样的东西中(比如旧的外部CSS打印格式控件)。 带有id和/或CLASSES的图例代码将与命名div类冲突。

获取屏幕的宽度。 然后使保证金左25% 使利润率达到25%

通过这种方式,容器的内容将位于中间。

示例:假设容器宽度= 800px;

<div class='container' width='device-width' id='updatedContent'>
    <p id='myContent'></p>
    <contents></contents>
    <contents></contents>
</div>

if ($("#myContent").parent === $("updatedContent"))
{
    $("#myContent").css({
        'left': '-(device-width/0.25)px';
        'right': '-(device-width/0.225)px';
    });
}

你也可以这样使用它:

<div style="width: 60%; margin: 0px auto;">
    Your contents here...
</div>

在我的情况下,手机屏幕大小是未知的,这是我所做的。

HTML

<div class="loadingImg"></div>

CSS

.loadingImg{
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 9999999;
    border: 0;
    background: url('../images/loading.gif') no-repeat center;
    background-size: 50px 50px;
    display: block;
    margin: 0 auto;
    -webkit-border-radius: 50px;
    border-radius: 50px;
}

JavaScript(在需要显示此DIV之前)

$(".loadingImg").css("height",$(document).height());
$(".loadingImg").css("width",$(document).width());
$(".loadingImg").show();
.middle {
   margin:0 auto;
   text-align: center;
}

/*它把div放到中心*/