ワードプレスで蛍光ペンを引いたかのような線を表示する

2015/03/02 2015/03/19

なぜかiPhoneでは色がつかない！PCからは見えます！
の状態から、修正しました。

スタイルシートの最初のフォントなどの指定のすぐ下の挿入しました。

青色マーカー文字css修正後
緑色マーカー文字css修正後

青色マーカー文字
赤色マーカー文字
黄色マーカー文字
緑色マーカー文字
ワードプレスで蛍光ペンを引いたかのような線を表示する
こちらのブログを参考にさせていただきました！

CSS（スタイルシート）記述

Crayon Syntax Highlighterのプラグインで挿入

/*マーカー*/
.marker_b {
background-color: #4169e1;
margin-left: 0.0em;
margin-right: 0.2em;
}
.marker_r {
background-color: #ff6347;
margin-left: 0.0em;
margin-right: 0.2em;
}
.marker_y {
background-color: #FFFF00;
margin-left: 0.0em;
margin-right: 0.2em;
}
.marker_g {
background-color: #7CFC00;
margin-left: 0.0em;
margin-right: 0.2em;
}
/*マーカー*/

そのままコピペでビジュアルに貼り付け

/*マーカー*/
.marker_b {
background-color: #4169e1;
margin-left: 0.0em;
margin-right: 0.2em;
}
.marker_r {
background-color: #ff6347;
margin-left: 0.0em;
margin-right: 0.2em;
}
.marker_y {
background-color: #FFFF00;
margin-left: 0.0em;
margin-right: 0.2em;
}
.marker_g {
background-color: #7CFC00;
margin-left: 0.0em;
margin-right: 0.2em;

}

/*マーカー*/

html記述

<span class="marker_b">青色マーカー文字</span>
<span class="marker_r">赤色マーカー文字</span>
<span class="marker_y">黄色マーカー文字</span>
<span class="marker_g">緑色マーカー文字</span>

そのままコピペでビジュアルに貼り付け
青色マーカー文字
赤色マーカー文字
黄色マーカー文字
緑色マーカー文字

- wordpress