ブログをMarkdownで書いているのですが、Tableを記述した時にボーダーや色がつかないことに気づきました。
勝手につくものと思っていたのですが、CSSを追記する必要があったので、まとめておきます。
Markdownで書いた部分はclassがmarkedのdivタグの下になっているので、その下のテーブルに適応させるようにしています。
まずは、CSSを記述する場所ですが、「テーマ」を選択して「カスタマイズ」を選択します。
Blogger テーマデザイナーが表示されるので、「上級者向け」を選択してCSSを追加します。
以下追加します。
```css
`gutter:true;
.marked table {
border-collapse: collapse;
}
.marked table, td, th {
border: 1px solid black;
padding: 5px;
}
.marked table tr:nth-child(even) {
background: #F9F9F9;
}
.marked table tr:nth-child(odd) {
background: #FFFFFF;
}
```
こんな感じのテーブルになります。
| タイトル | 内容 |
|----------|----------------------|
| 東京都 | 日本の首都 |
| 長野県 | 山がいっぱいで楽しい |
| 北海道 | 食べのものが美味しい |
| 沖縄 | とにかく楽しい |
tdたぐにpaddingを指定すると、テーブルの中に余裕が生まれます。
0 件のコメント :
コメントを投稿