はてなブログで、<TABLE>の<TH><TD>の余白(padding)を変更するには、「!important」が必要。
■ 特定の記事ページのみ変更する場合は、記事編集の「HTML編集」で、<style>~</style>を入れればよい。
【ページ内の全部のテーブル】
<style> th, td { padding: 3px !important; } </style>
ただし、id付きのテーブルの場合は、「!important」は不要。
【特定のidのテーブル】
<style> #id名 th, td { padding: 3px; } </style>
■ ブログ全体の<TABLE>の<TH><TD>の余白(padding)を変更するには、「デザイン」で設定する。
- 〔デザイン〕→〔カスタマイズ〕→〔デザインCSS〕
のところに、以下のCSSを追加。この場合も、「!important」が必要。
.entry-content th, td { padding: 3px !important; line-height: 1.5em; }
※ 備忘録として、現時点の「デザインCSS」の中身。
- 「.entry-content」は、ブログ全体に反映。
- 「.images-row」は、横並びの画像全てに反映。
- <table>のフォントを小さくしたい時は、「class="font-small"」を付ける。
/* <system section="theme" selected="17680117127095289072"> */ @import url("https://blog.hatena.ne.jp/-/theme/17680117127095289072.css"); /* </system> */ .entry-content em { background: linear-gradient(transparent 70%, #FFFF00 70%); font-style: normal; font-weight: bold; } .em-gold em { background: linear-gradient(transparent 70%, #FFD700 70%); font-style: normal; font-weight: bold; } .em-orange em { background: linear-gradient(transparent 70%, #FFA500 70%); font-style: normal; font-weight: bold; } .entry-content th, td { padding: 3px !important; line-height: 1.5em; } .td-center th, td { text-align : center; } .td-top th, td { vertical-align: top; } .font-small { font-size: 0.8rem; } .entry-content pre { margin: 0 0 1.5em 0; padding: 0.5em; line-height: 1.2em; border: 1px solid #e4e4e4; background: #f8f8f8; border-radius: 2px; } .images-row { display: flex; justify-content: center; align-items: start; } * { font-family: 'Noto Sans JP', sans-serif; }