ワードプレスで蛍光ペンを引いたかのような線を表示する
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>
そのままコピペでビジュアルに貼り付け
<span class=”marker_b”>青色マーカー文字</span>
<span class=”marker_r”>赤色マーカー文字</span>
<span class=”marker_y”>黄色マーカー文字</span>
<span class=”marker_g”>緑色マーカー文字</span>
関連記事
-
-
Contact Form 7で自動返信メールWordPress
スポンサードリンク 自動返信メールはおくれますか? こちらのサイトにも書いてある …
-
-
さくらサーバーにWordPressをインストール
スポンサードリンク ついにさくらサーバーにWordPressをインストールしてみ …
-
-
iphone、android、mac、windows対応bluetoothキーボードレビュー
スポンサードリンク Yahoo!ショッピングで1700円位で購入しました。別途単 …
-
-
日本エレキテル連合、錦糸町に来る!
スポンサードリンク 11月9日に来るそうです。 スマホから、wordpressの …
-
-
stinger5にドロップダウンメニューをcssのみでつける
スポンサードリンク いろいろ探したのですが、CSSのみで変更できるので、こちらの …
-
-
プラグイン「Favicon by RealFaviconGenerator」でファビコン設置
スポンサードリンク プラグイン「Favicon by RealFaviconGe …
-
-
ウーマンラッシュアワー、中川パラダイスさんにオファー!
スポンサードリンク 整体のモニターのオファーをしてみました。 芸能人の方に直接オ …
-
-
Crayon Syntax Highlighter文字化け
スポンサードリンク どうやらphpのバージョンなどでエラーのなってしまうようです …
-
-
stinger5でサイドバーのnewpostを消す!
スポンサードリンク stinger5でサイドバー部分のnewpostを消す! こ …
-
-
stinger5メニューをCSSのみ変更でドロップダウンで表示する!
スポンサードリンク Stinger5 をCSSのみで多階層ドロップダウンメニュー …