0

だから私は再びhtml/cssに入ろうとしていて、ボーダープロパティにいくつかの問題があります。div ONE の境界線が 1 の場合、div TWO でパディングが正しく動作しません。これは、パディングの代わりに TWO のマージンを使用することで「修正」できます。ONE に境界線がない場合、TWO のマージンが ONE を押し下げます。マージンの代わりにパディングを使用すると、これは修正されますが、意味がありません。境界線と div の使用に関する知恵の言葉はありますか? ここでかなり混乱。

以下のコードは余白用で、境界線はありません。

HTML コード:

<html>
<head>
    <link rel="stylesheet" type="text/css" href="css/tyle.css" />
</head>
<body>
    <div class="ONE">
        <div class="TWO">This is some text as a test.</div>
    </div>
</body>
</html>

CSS スタイル:

body {
    background: #e3f1e2;
    margin: 0px;
    padding: 0px;
    font-family: arial;
    font-size: 12px;
    color: #000000;
}

a:link {text-decoration: none; color: #FFFFFF}
a.menu:link {text-decoration: none; color: #FFFFFF}
a:visited {text-decoration: none; color: #FFFFFF}

div.ONE {
    /*border: 1px solid #CCCCCC;*/
    background-image: url("../test.jpg");
    background-repeat: no-repeat;
    text-align: left;
    width: 1024px;
    height: 800px;
    padding: 0px;
    margin: 0px;
    margin-top: 0px;
    margin-left: auto;
    margin-right: auto;
    }
div.TWO {
    margin-top: 80px;
    margin-left: 120px;
    }
4

1 に答える 1

1

ボーダーは通常、外側にあります。box-sizing:border-box;css で使用して動作させることができます。も参照してください：ボーダーをdivの内側に配置し、その端には配置しない

于 2013-11-07T17:05:39.063 に答える