HTMLタグ/CSS一覧と初心者向けホームページ作成解説集:HTMLタグボード

HTMLタグボードのトップへ戻る ゼロから始めるホームページ作成講座 訪問者優位のWEBデザインTips インターネットで小遣い稼ぎ 今すぐ使える!便利ツール(HTMLタグ辞典など)


表のセルの境界線を重ねる

CSSの書き方

border-collapse:値 ;

CSSの詳細情報
プロパティ名 border-collapse 読み方 ボーダー・コラプス
初期値 separate 意味 境界線の重合
separate/collapse
対象 table(表)要素
CSSレベル CSSレベル2 対応ブラウザ Windows MAC
継承 する IE 5.0以上/FF1.0/NS7.1/OP8.0 SF

解説

「border-collapse」プロパティは、セルに境界線を表示した場合の境界線の重なり方を指定するスタイルシートです。通常では、境界線は互いに離れて表示されますが、境界線を重ねて(つぶして)表示させることもできます。

これは、HTMLのtble要素の属性「boder」を「border="0"」とした時の表示と同じです。

値(separate)

「border-collapse:separate;」は初期値です。この場合は、境界線は離れて表示されます。

値(collapse)

「border-collapse:collapse;」とすると、境界線は重ねて表示されます。

CSS/HTMLサンプル

table { border-collapse:collapse; width:350px; border:1px solid #666666; background:#f6f6f6;}
td { border:1px solid #666666; padding:2px; }

表の境界線を重ねる サンプル