• RSS

[CSS]CSS でtable タグのcellspacing cellspadding を指定する方法

  • このエントリーをはてなブックマークに追加
  • follow us in feedly

table のセルの間隔とセル内の余白を、cellpadding、cellspacingは使わずにCSS で指定する方法のご紹介です。

table タグにcellpadding、cellspacing などを記述

table タグにcellpadding、cellspacing を指定し、セルの間隔とセル内の余白を共に0にする場合は、以下のような記述になります。
※テーブルを分かり易く見せる為に、borderも指定しています。

ブラウザにも依りますが、概ね↓このような見え方になります。
CSS でtable タグのcellspacing cellspadding などを指定する方法

CSS でセル内の余白や枠線の調整

今度はtable タグのcellpadding、cellspacing の記述は消し、替わりにtable class="css" を付けて、

スタイルシートでセルの間隔とセル内の余白を調整してみます。

border-collapse:collapse でセルの間隔を無くして、padding:0 でセル内の余白を0 にしていますので、↓このような見え方になります。
CSS でtable タグのcellspacing cellspadding などを指定する方法



  • このエントリーをはてなブックマークに追加
  • follow us in feedly

コメント

コメントを残す