蛍光ペン 黄色以外も使いたい

 

ブログで書いた記事の中で強調させたい文章があるときは

 

そこを太字にしたり、文字サイズを大きくしたりすると思いますが

 

もう1つ、目立たさせる文字装飾がありますよね。

 

そうです。 蛍光ペンです。

 

 

 

蛍光ペンっていうと
まず、ポピュラーな色として定着しているのは、黄色でしょう。

 

 

たしかに、私も学生時代、
教科書や参考書に引いてた色は、ほとんど黄色でした。

 

あなたも引いてましたよね。

 

 

 

ブログをシリウス (SIRIUS) で作っているという方、

 

 

シリウスに予めセットされている色は、黄色ですよね。
あっ、黄色っていってもちょっと濃い系の山吹色って感じですかね。
レモンイエローではないですね。

 

 

まあ、そのセットされている黄色の蛍光ペンをよく使われていると思いますが、

 

「他の色の蛍光ペンもあったらなあ・・・」

 

そう思ったことないですか?

 

 

黄色のワンパターンよりは、ちょっとアクセント的に他の色があれば、
使ってみたくなりますよね。

 

 

 

その色、増やすことできますよ。

 

ご紹介しますね。

 

 

シリウスの「編集」タブ → スタイルシート を開けると

 

commonstyles.css というタブがあるので、そのタブを開きます。

 

 

そのページの235行目(付近)
こちら↓のような記述があります。

 

 

.ylw{
background-color:#FFE566;
font-weight:bold;
padding:2px;
}

 

 

これが記事を書いているときに使う装飾ボタンのなかで
黄色い蛍光ペンを引くときの指令文なんですね。

 

 

#FFE566は、カラーコード
bold は、太字
2px は、蛍光ペンの四角い枠と文字との間隔(上下左右) を指定しています。

 

 

これに、例えば、

 

青い 蛍光ペンを追加したい場合は、
こちら↓の構文をその下に追記して保存します。

 

 

.blue{
background-color:#0000FF;
font-weight:bold;
padding:2px;
}

 

 

そのあと、

 

シリウス画面、最上部にある「設定」メニューの中に「クラスの設定」がありますので、
その画面にある「クラス名」blue と入れてください。

 

そうすると、

 

装飾ボタン群2段目の右端にあるボタンの中に blue と表示されますので
その blue を選ぶことで、いつでも青い蛍光ペンを使うことができます。

 

 

 

 

他の色もセットしたいという場合は、

 

commonstyles.css ページにある上記の構文の

 

.blue そして、カラーコードを表す #0000FF の部分を変えれば
様々な色の蛍光ペンをセットすることが可能です。

 

 

カラーコードの一覧は、こちら を参照くださいね。

 

 

 

ここまでお伝えしたのは、

 

シリウスの中に蛍光ペンのHTML構文を埋め込んだ形での設定です。

 

まあ、よく使う色の蛍光ペンなら

 

このような設定をすれば使うときラクでいいですよね。

 

 

でも

 

頻繁に使うわけではなく

 

今だけ、この記事のこの部分だけ、この色の蛍光ペンを使いたい!

 

というときもあるかもしれませんよね。

 

 

 

そのようなときは、

 

こちら ↓ のHTMLタグを直接、記事入力エリアに入れてしまえばOKです。

 

 

<span style="padding: 2px; background-color: #0000FF">蛍光ペン</span>

 

 

#0000FF のカラーコードの部分だけ、好きな色のコードにするだけです。

 

この例は、テキストが太字にはなっていませんが、
太字にしたいときは、このタグをマークして、太字にするB ボタンを押せばOKです。

 

 

 

 

このようにして

 

いくらでも様々な色の蛍光ペンをシリウスで引くことができます。

 

 

 

でも、たくさんセットすることはできますが、

 

1つの記事内でいろんな色を使いすぎると、

 

かえって読者の方が不快に感じたりするかもしれませんから

 

どうでしょうかぁ・・・多くても3色? いや、2色までに抑えるのがいいでしょうかねぇ。

 

記事の内容に合わせて使うといいかもしれませんね。

 

 

 

 

青い蛍光ペン

 

私はこの記事を書いたときに使用しました。

 

        ↓ ↓ ↓

 

http://managatsuo.com/rakuten/entry15.html

 



*-----------------------------------------------------------------------------------*

   最後までお読みいただき、ありがとうございます。
   記事が少しでも参考になれば幸いです。

                  ブログランキング・にほんブログ村へ