CSSの幅と高さのプロパティの詳細な説明-CSSチュートリアル-php.cn

この記事では、cssに関する関連知識を提供します。主に、要素の高さと幅の属性の設定に関する関連問題を紹介します。高さ属性と幅属性は、要素の高さと幅を設定するために使用されます。高さと幅のプロパティには、パディング、境界線、またはマージンは含まれません。一緒に見てみましょう。皆さんのお役に立てれば幸いです。 .

CSSの幅と高さのプロパティの詳細な説明

(学習ビデオ共有:css ビデオチュートリアル、html ビデオチュートリアル)

CSS の高さの設定および width

height プロパティと width プロパティは、要素の高さと幅を設定するために使用されます。
高さと幅のプロパティには、パディング、境界線、またはマージンは含まれません。要素のパディング、境界線、およびマージン内の領域の高さまたは幅を設定します。

#CSS の高さと幅の値

##height

およびwidthプロパティは次の値に設定できます:

auto
- デフォルト。ブラウザは高さと幅を計算します。
#length
- 高さ/幅を px、cm などで定義します。
%
- 高さ/幅を、含まれるブロックのパーセンテージとして定義します。
#initial
- 高さ/幅をデフォルト値に設定します。
inherit
- 親の値から高さ/幅を継承します。

要素の高さと幅を設定します:

设置元素的高度和宽度

这个 div 元素的高度为 200 像素，宽度为 50%：

ログイン後にコピー

出力結果:
高さと幅のプロパティには、パディング、境界線、またはマージンが含まれないことに注意してください。要素のパディング、境界線、およびマージン内の領域の高さ/幅を設定します。
Set max-width
max-width 属性は、要素の最大幅を設定するために使用されます。
max-width (最大幅) は、長さの値 (px、cm など) または含まれるブロックのパーセンテージ (%) として指定できます。あるいは、なしに設定することもできます (デフォルト。最大幅がないことを意味します）。
ブラウザウィンドウが要素の幅 (500px) より小さい場合、前述の
の問題が発生します。ブラウザーはページに水平スクロールバーを追加します。
この場合、max-width を使用すると、ブラウザによる小さなウィンドウの処理が向上します。
ヒント: 2 つの div の違いを確認するには、ブラウザウィンドウを幅 500 ピクセル未満にドラッグします。
注: max-width 属性の値は幅をオーバーライドします。
例は次のとおりです:

设置元素的最大宽度

这个 div 元素的高度为 100 像素，最大宽度为 500 像素：

请调整浏览器窗口来查看效果。

ログイン後にコピー

出力結果:

##css サイズ属性:

#(学習ビデオ共有:
css ビデオチュートリアル
、html ビデオチュートリアル
)

以上がCSSの幅と高さのプロパティの詳細な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。