詳解逆引きHTML+CSS辞典

要素の領域 - ボーダーも含めて幅や高さを指定したい

登録タグ
Icon comment count 0
Icon stock count 0

ボーダーも含めて幅や高さを指定したい

幅の指定に境界線も含めたい

box-sizingプロパティ 高さ

widthプロパティとheightプロパティで指定した値は、初期状態ではボックスの「要素内容を表示する領域」の幅と高さとして適用されます。これをボックスの他の領域に対して適用するように変更するには、box-sizingプロパティを使用します。

box-sizingプロパティの値には「content-box」「padding-box」「border-box」という3種類のキーワードが指定できます。初期値の「content-box」の場合はwidthプロパティとheightプロパティの値を「要素内容を表示する領域」の幅と高さとして適用しますが、「padding-box」を指定するとパディングの外側までの領域、「border-box」を指定するとボーダーの外側までの領域の幅と高さとして適用するようになります。</

出典情報

Medium

詳解逆引きHTML+CSS辞典

  • 著者: 大藤 幹

コメント

    コメントはありません