HTMLの境界線の隙間を取り除く方法-htmlチュートリアル-php.cn

HTMLの境界線の隙間を取り除く方法

醉折花枝作酒筹

リリース： 2023-01-06 11:16:41

オリジナル

7859 人が閲覧しました

HTML では、cellspacing 属性を使用して境界線のギャップを削除できます。テーブル要素に「cellspacing="0px"」スタイルを設定するだけです。 Cellspacing プロパティは、テーブル内の個々のセル間の距離を制御します。このプロパティは、異なる隣接するセルのエッジ間のスペースを変更します。

HTMLの境界線の隙間を取り除く方法

このチュートリアルの動作環境: Windows 7 システム、CSS3&HTML5 バージョン、Dell G3 コンピューター。

<!DOCTYPE html>
<html>
  <head>
    <title>test</title>
  </head>
  <body>
    <table border="1">
      <tr>
        <th>NAME</th>
        <th>AGE</th>
        <th>NUMBER</th>
      </tr>
      <tr>
        <td>xm</td>
        <td>10</td>
        <td>2020</td>
      </tr>
      <tr>
        <td>xh</td>
        <td>3</td>
        <td>2021</td>
      </tr>
      <tr>
        <td>xf</td>
        <td>4</td>
        <td>2010</td>
      </tr>
    </table>
  </body>
</html>

ログイン後にコピー

表示される効果:

HTMLの境界線の隙間を取り除く方法

// 在<table>标签中添加属性：
cellpadding="10px" cellspacing="0px"

ログイン後にコピー

表示される効果は次のとおりです:

HTMLの境界線の隙間を取り除く方法

Cellpadding属性

コンテンツと外枠の間のセルスペースを設定する属性は、cellpaddingと呼ばれます。つまり、セルの周囲のコンテンツとセルの境界線の間の距離は、cellpadding プロパティによって管理されます。この距離の単位は、HTML ではピクセルまたはパーセンテージとして暗黙的に指定できます。

ユーザーのニーズに応じて、cellpadding 属性値を 0 にすることもできます。テキストを互いに分離するために使用され、外観が向上します。

注: 古いバージョンの HTML では cellpadding コマンドがサポートされていますが、新しいバージョンの HTML5 では cellpadding が許可されないため、必要に応じて代替 CSS を使用して同じ書式設定が提供されます。

Cellspacing プロパティ

Cellspacing プロパティは、テーブル内の個々のセル間の距離を制御できます。このプロパティを使用すると、設計者は、異なる隣接するセルのエッジ間のスペースを簡単に変更できます。

セル間隔プロパティは主に Web デザインで使用されます。言語が異なれば、セル間隔の構文もまったく異なります。たとえば、CSS では「border-spacing」属性を使用し、HTML では「cellspacing」属性を使用します。

拡張情報:

セルパディングとセルスペースの主な違いは、セルパディングはセルの端とその内容の間の幅を固定するために使用されることです。テキストとセルの間に境界線があると、セル内に空白が作成されます。ただし、セル間隔を使用して、テーブル内の個々のセル間のスペースを管理できます。

以上がHTMLの境界線の隙間を取り除く方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。