ホームページ > 記事 > ウェブフロントエンド > CSSプロパティの説明: パディング
1. パディングとコンテナーのサイズの関係
ブロックの水平要素の場合: ① パディング値が異常になると、サイズに影響します。 ② 幅は自動ではなく、パディングはサイズに影響します。 auto または box-sizing は border-box であり、同時にパディング値が狂うことはなく、サイズに影響を与えません。
インライン水平要素の場合: 水平方向のパディングはサイズに影響しますが、垂直方向のパディングはサイズに影響しませんが、背景色に影響します。垂直パディングが大きすぎて親コンテナを超えると、scrollHeight に影響します。2. 負の値とパーセンテージ値のパディング
負の値のパディングについて: パディングは負の値のいかなる形式もサポートしません。 パディングのパーセント値について: パディングのパーセントは、幅に対して相対的に計算されます。 インライン水平要素のパディングのパーセンテージ値は、①幅に対しても計算されます、②デフォルトの高さと幅の詳細は異なります、③パディングは改行します。3. label要素の組み込みパディング
ol/ul list: ol/li要素にはpadding-leftが組み込まれていますが、単位はemではなくpxです。たとえば、Chromeブラウザは40pxです。フォント サイズが小さいと、間隔が非常に小さくなります。フォント サイズが大きすぎると、シリアル番号がコンテナからはみ出してしまいます。経験が少ない: テキスト サイズが 12 ~ 14 ピクセルの場合、padding-left の値は 22 ~ 25 ピクセルの方が適切です。
その他の要素: ① すべてのブラウザには、input/textarea 入力ボックスに組み込みのパディングがあります。 ② すべてのブラウザには、ボタンのボタンに組み込みのパディングがあります。 ③ 一部のブラウザには、選択ドロップダウンに組み込みのパディングがあります。パディングを設定できる Firefox IE8+ など; ④ すべてのブラウザのラジオ/チェックボックスにはパディングが組み込まれていません。 ⑤ ボタン ボタン要素のパディングは制御が最も困難です。 ボタンフォームボタンパディング:このため、ボタンを作成するときは、ボタンをシミュレートするために タグをよく使用します
4. パディングおよびグラフィックス 描画
5、パディングとレイアウト
パーセンテージ単位を使用して、固定比率のレイアウト構造を構築します: マージンが等しい高さのレイアウトの場合: 2 列アダプティブ レイアウト:
以上がCSSプロパティの説明: パディングの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。