12月
20

[WordPress]初心者マヨのスタイルシート「テーブル」

Markdown記法 テーブル試してみたよ♪ | iPhoneとマヨテキメモ 2

先日、マークダウン記法でテーブルのタグをHTMLに変換できたまではよかったんです。
ですが、いざブログに表示したら、テーブルには確かになっているのですが、
枠というかボックス?に線がひかれていないのです。


その事を、先日のエントリで書いていたので、
@hondamarlboroさんから、このようなアドバイスを頂きました。
いつも、ありがとうございます!

私のテーマのスタイルシート

私のテーマのスタイルシートを見てみたら、やはり何も指定されていないのです。
こんな事に気が回らない全くのド素人。:゚(;´∩`;)゚:。
遭遇して分かるという、お粗末さです。

table {
		border-collapse: collapse;
		border-spacing: 0; }

スタイルシートに追加

テーマによっても違うと思うのですが、
私はこのようにとりあえずしてみました。
装飾とかもできるようですが、シンプルに線だけにしました。

/**これで表示**/
table {
margin: 5px; /*外側の余白 */
width: 275px; /* テーブルの横幅 */ 
border-collapse: collapse; /* 枠線の表示方法 */ 
border: 1px #777e41  solid; /* テーブル全体の枠線(太さ・色・スタイル) */ 
}

table TH { 
border: 1px #777e41  solid; /* セルの枠線(太さ・色・スタイル) */
padding: 5px; /* セル内の余白 */  
} 

table TD { 
border: 1px #777e41  solid; /* セルの枠線(太さ・色・スタイル) */
padding: 5px; /* セル内の余白 */  
}

最初は「th」を入れなかったり、幅を指定しなかったりで、上手くいきませんでしたw

Markdown記法 テーブル

完成!?

パーセント表示にした方が、デバイス毎に違うのでいいのかもしれませんが、
よく調べていないので、とりまこれで完成としておきます(笑)

Markdown記法 テーブル2

box指定もした方がいいのかな〜
スクショかどうか分かりにくいですね。
後で忘れるといけないので、備忘録としてまで、
では、では。。

【こちらの関連記事もご覧ください】


記事をお読み頂き、ありがとうございます!

記事の内容を気に入って頂けましたか?
もし気に入って頂けましたら、
ソーシャルボタンで共有頂ければ、とても嬉しいです♪


follow us in feedly RSS

Leave a Reply

  • (will not be published)

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

This blog is kept spam free by WP-SpamFree.