初心者の方にとっては、この字の変更(色や大きさなど)も一苦労でしょう。どうやって変えるんだろう?なんて悩んじゃいますよね?私も初めはそうでした。

慣れちゃえば、もぉ本当になんてことはないんですよね。こうゆうことって。でもね、最初は分からないのが当たり前です。なんども繰り返しやっていくと簡単に覚えちゃいますので、ぜひトライしてみて下さい。

今回は、字の大きさと色の変更のやり方をお伝えします。通常は、記事を書く時に’ビジュアルモード’にしているかと思います。で、こういった装飾をしたりする時には’テキストモード’に切り替えて入力しますので、それだけは覚えておいて下さい。⇒ビジュアルモード/テキストモード

文字の大きさを変える指定文

テキストモードに切り替えた上で、以下の様に入力をします。

 <span style="font-size: ◯◯px;">大きさを変えたい文字</span>

◯◯のところには’数字’が入ります。’px’って言うのは単位です。ピクセルって読みます。セル(画素数)の単位になるので、字の大きさはピクセルって言うんだぁ、って言う程度でOKです。

このサイトのこの記事上の文字の大きさは、’14px’に指定されています。ただ、ブラウザなどによって、実際に見える大きさって言うのは多少異なるので、その点はご注意下さい。

では実際に大きさを変えてみましょう♫

 <span style="font-size: 20px;">大きさを変えたい文字</span>

これを実際に’テキストモード’で入力して、’ビジュアルモード’で見てみるとこうなります。

大きさを変えたい文字

チョッと大き過ぎましたね(笑　でも、チャンと大きくなりましたね。こんな感じで指定すると、サイト上で反映されます。では続いて色を変えて見ましょう♫

文字の色を変える指定文

テキストモードに切り替えた上で、以下の様に入力をします。

 <span style=" color: #カラーコード;">色を変えたい文字</span>

さっきと良く似ていますね。今度は色指定なので’color’になっています。カラーコードについての詳細は、こちらカラーコード簡単取得方法をご覧下さい。

では実際に色をつけてみましょう♫

 <span style=" color: #ff0000;">色を変えたい文字</span>

この’#’プラス6桁の数字が色を表しています。これを’ビジュアルモード’で見てみると…、

色を変えたい文字

こうなります。チャンと色が変わっていましたね。ちなみに大きさと色を同時に変える事もできます。そうゆう時には、この様に入力します。

 <span style="font-size: 20px; color: #ff0000;">大きさと色を変えたい文字</span>

で、実際に’ビジュアルモード’で見てみるとこんな感じになります。

大きさと色を変えたい文字

大きさ色ともに変わりましたね。初心者の方は、ぜひ記事で使ってみて下さいね☆