Question

嗨，我有绝对定位的问题，我想要最大/最小宽度/高度和居中的页面有背景; 这是我的css代码，但是做中心工作...... 我需要将身体与这个代码对齐

css代码：

body
 {
     position:absolute;
     font-family: "b nazanin","b roya", times new roman;
     font-size:16px;

         min-width:948px;
     min-height:550px;

     width:1280px;
     height:700px;


 }

html
{
     background: fixed -webkit-linear-gradient(red, blue); /* For Safari */
     background: fixed -o-linear-gradient(red, blue); /* For Opera 11.1 to 12.0 */
     background: fixed -moz-linear-gradient(red, blue); /* For Firefox 3.6 to 15 */
     background: fixed -webkit-linear-gradient(red, blue); /* For Firefox 3.6 to 15 */
     background: fixed linear-gradient(red, blue);

}

Answer 1

min-width，min-height仅在宽度和高度为动态时使用。

选中http://jsfiddle.net/Ur6ZR/8/

body {
    font-family:"b nazanin", "b roya", times new roman;
    font-size:16px;
    outline:10px solid white;
    margin:0 auto;
    min-width:948px;
    min-height:550px;
    width:100%;
    height:100%;
}
html {
    background: fixed -webkit-linear-gradient(red, blue);
    background: fixed -o-linear-gradient(red, blue);
    background: fixed -moz-linear-gradient(red, blue);
    background: fixed -webkit-linear-gradient(red, blue);
    background: fixed linear-gradient(red, blue);
}

看看它是否可以帮到你。

Answer 2

为了使身体居中，你需要这个：

body{
     margin:0 auto;
     width:1000px;
}

此代码适用于所有浏览器（Firefox，Chrome，IE [7-11]，Opera（也是Presto））。你不需要更多（为此目的）这段代码就是一个例子。所以，也许你需要做一些（小）调整。

您不应该使用position:absolute。这是一个糟糕的方式。如Mörre所说，它对我来说也没有意义。我建议你重新评估你的方法。 position:absolute有时可能很有用，但对于这种情况，它完全没用。

Answer 3

最好使用<div>代替。通常不鼓励格式化<html>标记。

CSS：

body {
    background: fixed -webkit-linear-gradient(red, blue); /* For Safari */
    background: fixed -o-linear-gradient(red, blue); /* For Opera 11.1 to 12.0 */
    background: fixed -moz-linear-gradient(red, blue); /* For Firefox 3.6 to 15 */
    background: fixed -webkit-linear-gradient(red, blue); /* For Firefox 3.6 to 15 */
    background: fixed linear-gradient(red, blue);
    border: 0; /* removes the default body border */
    font-family: 'b nazanin', 'b roya', Times New Roman;
    font-size: 18px;
}

div /* replace with the elements class */ {
    height: 700px;
    margin: auto; /* will cause the element to be center aligned */
    /* min-height and min-width are useless with a fixed height and width */
    width: 1280px;
}

如果您想要一个内容居中的网页，请尝试以下方法：

body {
    border: 0;
}

.wrapper {
    margin: auto;
    width: 960px; /* 960px is probably the max width you would want to use */
}

Html看起来像这样：

<body>
    <div class="wrapper">
        <!-- content -->
    </div>
</body>

使身体与中心对齐 - 居中的身体

3 个答案: