0

私はウェブサイトを使用してマシンを制御するプロジェクトに取り組んでおり、現在cssスタイルシートに取り組んでいます。私は今このスクリプトを持っています:

    <html>
    <head>
        <title>Machine overview V1</title>
        <meta charset="utf-8"/>
</head>
<body>
    <header>
<h1>Machine overview</h1>
</header>
    <section>
</section>
    <footer>
</footer>
</body>
</html>

今それを言うことができます:

header{height:15%;width:100%;}
section{height:80%;width:100%;}
footer{height:5%;width:100%;}

しかし、あなたが追加するとき

border:1px solid black;

これらの属性のいずれかに対して、高さ(%)
が台無しになり、基本的にページのレイアウト全体が台無しになります。
さまざまな解像度を使用して見栄えを良くする必要があるため、npxで高さを強制することはできません。
オブジェクトの高さに境界線を挿入する方法はありますか?
ボックスシャドウをはめ込むことができるように...

4

1 に答える 1

1

コンテナを次のように設定しますbox-sizing:border-box;

.borderInside {
  box-sizing:border-box;
  -moz-box-sizing:border-box;
  -webkit-box-sizing:border-box;
  border:1px solid red;
}
于 2013-03-03T12:21:50.413 に答える