ホームページ  >  記事  >  ウェブフロントエンド  >  CSSpadding_html/css_WEB-ITnose

CSSpadding_html/css_WEB-ITnose

WBOY
WBOYオリジナル
2016-06-24 11:53:211336ブラウズ

CSS パディングは、div テーブルの内部スペースを制御するために使用されます。

CSS パディング

CSS パディングを使用すると、デフォルトのギャップ内に表示されるさまざまな HTML を変更できます。 . 要素 (段落、表など)。しかし、まず最初に、充填の定義についての理解を信じてみましょう。コンポーネントの境界線とその中のコンテンツの間の埋め込まれたスペース。

以下の例の視覚的表現をご覧ください。注: 各要素の境界線が明確になっているので、パディングの効果をより簡単に確認できます。 red;}


CSS パディング プロパティを定義するには、いくつかの方法があります。あらゆる方法をご説明し、どの方法が最適であるかをお知らせいたします。

CSS パディング:

上の例でわかるように、パディングは均一係数にすることができます。値を指定すると、上、右、下、左のすべての側面に均一なパディングが作成されます。正確な値を使用する代わりに、パディングに使用するパーセンテージを定義することもできます。

p {パディング: 2%; ボーダー: 1px ソリッドブラック; }

CSS パディング: パディング (方向):
各 HTML 要素には実際には 4 つの異なるパディングがあります: 上、右、下、左。これらの個々のパディングは、パディング プロパティに方向サフィックスを追加するだけで決定できます。たとえば、フォーム: fill(direction)。決定された 1 つの方向だけが、他の 3 つのデフォルトのパディングを変更しないままにします。

p { パディング左: 5px; ボーダー: 1px 黒一色; }

h5{
パディングトップ: 0px;

パディング右: 2px;

パディングボトム: 13px;
パディング左: 21px;
ボーダー: 1px ソリッドレッド;
}



CSS パディング: 2 & 4 の値

2 つまたは 4 つの値を指定することで、4 つのパディング値を一度に宣言できます。 2 つの値のみを使用する場合、最初の値はパディングの上部と下部を決定し、2 番目の値はパディングの左右を決定します。

4 つの値の塗りつぶし仕様を使用する場合、対応する方向は上、右、下、左です。コマンドが何であるかを覚えやすくするために、コマンドは上から始まり、左に到達するまで時計回りに移動することを覚えておいてください。以下の例は、部分的 (2) および完全な (4) パディングが使用されていることを示しています。 出典: http://www.111cn.net/cssdiv/56/f1cad8ffb23e3e668d3d62cff5c4f368.htm




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