Markdown.js で記述しているTableに色をつける

ブログを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 件のコメント :

コメントを投稿