ホームページ  >  記事  >  ウェブフロントエンド  >  CSSのディメンションとは何ですか? (コード例)

CSSのディメンションとは何ですか? (コード例)

青灯夜游
青灯夜游オリジナル
2018-09-14 17:59:592663ブラウズ

この章では、CSS の Dimension とは何ですか?について説明します。 (コード例) .困っている友人は参考にしていただければ幸いです。

1. はじめに

CSS Dimension プロパティを使用すると、要素の高さと幅を制御できます。同様に、行間を広げることもできます。

2. ディメンション (サイズ) 属性値

CSSのディメンションとは何ですか? (コード例)

3.

(1) 例 1: さまざまな要素の高さを設定します

img.normal
{
    height:auto;
}
img.big
{
    height:120px;
}
p.ex
{
    height:100px;
    width:100px;
}

(2) 例 2: パーセント値を使用して要素の高さを設定します

html {height:100%;}
body {height:100%;}
img.normal {height:auto;}
img.big {height:50%;}
img.small {height:10%;}

(3) 例 3: ピクセル値を使用して要素の幅を設定します

img {width:200px;}

(4) 例 4: 要素の最大高さを設定します

p{
    max-height:50px;
    background-color:yellow;
}

(5) 例 5: パーセント値を使用して要素の最大幅を設定します

p{
    max-width:20%;
    background-color:yellow;
}

(6) 例 6: 要素の最小高さを設定します

p{
    min-height:100px;
    background-color:yellow;
}

(7) 例7: 要素の最小幅をピクセル値

p{
    min-width:150px;
    background-color:yellow;
}
で設定します

以上がCSSのディメンションとは何ですか? (コード例)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。