0

ラップトップ、ネットブック、またはデスクトップに表示される画面に応じて独自の幅と高さを調整する調整可能な div コンテナーを作成する方法を知りたいです。テキストがコンテナーの下またはオーバーフローせず、コンテナー内に空白が残らないようにする必要があります。

% または em を使用してみましたが、基本フォント サイズ 16px に基づいているため、小さなネットブック画面ではテキストがオーバーフローする場合や、大きな画面のデスクトップではコンテナーの下部に空白が残る場合があります。

どんな提案でも大歓迎です。

<style type="text/css">
    .tt
    {
        border: 2px solid red;
        height: 80px;
        width: 168px;
        font-size: 16px;
        padding: 0px;
    }

</style>
</head>

<body>
    <div class="tt">
        Hello World Hello World<br>
        Hello World Hello World<br>
        Hello World Hello World<br>
        Hello World Hello World<br>
    </div>
</body>
4

1 に答える 1

0

これを試して、div を画面に引き伸ばすことができます。

html, body, .tt { width:100%; height:100%; padding: 0; margin: 0;}

.tt
{
    border:2px solid red;
    font-size:16px;

    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    -ms-box-sizing:border-box;
    -o-box-sizing:border-box;
    box-sizing:border-box;
}

box-sizing は CSS3 プロパティであることに注意してください。使用したくない場合は、div から境界線を削除するか、テーブルを使用できます (非推奨)。

ホールスクリーンにもテキストを入力する必要がありますか? その場合、これは役に立ちます: CSS: フォントをサイズに設定して、テキストがコンテナ全体を占めるようにします

（リンクは重複した質問ですが、私の意見では、より理解しやすい回答があります）。

于 2012-10-13T05:11:20.047 に答える