パディングとは:

パディングはテキスト (コンテンツ) の外側(cè)と境界線 (境界線) の內(nèi)側(cè)にあります。この領(lǐng)域を制御する最も単純なプロパティは、padding プロパティです。 padding 屬性は、要素の境界線とそのコンテンツの間の空白を定義します。

CSS のパディング プロパティは、要素のパディングを定義します。パディング屬性は長さの値またはパーセント値を受け入れますが、負(fù)の値は許可されません。

均一なパディングを設(shè)定することも、一方的なパディングを設(shè)定することもできます。たとえば、すべての h1 要素の両側(cè)に 10 ピクセルのパディングを設(shè)定したい場合は、次のようにします:

h1 {padding: 10px;}

両側(cè)にパディングを設(shè)定することもできます上、右、下、左の順で、各側(cè)で異なる?yún)g位またはパーセンテージ値を使用できます:

h1 {padding: 10px 0.25em 2ex 20%;}

特定の側(cè)のみにパディングを設(shè)定したい場合は、次の 4 つを通じてのみ行うことができます。屬性:

padding-top

padding-right

padding-bottom

padding-left

名前の通り、わかりやすいですね。

數(shù)値の設(shè)定では、前に述べたようにさまざまな単位を使用できます。一般的に使用される?yún)g位はピクセル (px) とセンチメートル (cm) です。これは比較的単純です。簡単にテストしてください。 HTML ファイルにテーブルを書き込み、border 屬性を追加します:

<table border="1">
    <tr>
        <td>
            正文
        </td>
    </tr>
</table>

これは設(shè)定前のページです:

以下では、

h1 {
    padding-left: 5cm;
    padding-right: 5cm;
    padding-top: 30px;
    padding-bottom: 30px;
}

HTML コードを CSS ファイルに追加し、次のように更新します。

<table border="1">
    <tr>
        <td>
            <h1>正文</h1>
        </td>
    </tr>
</table>

以下はエフェクトのスクリーンショットです:

操作している領(lǐng)域がテキストの外側(cè)で境界線內(nèi)にあることがわかります。