4.プチ☆カスタマイズ

文字サイズ・色の変更 - HTMLのお勉強

【お知らせ】
2014.8.13NewUIになり、文章コンテンツに機能が追加され、下記のHTML編集をしなくても簡単に文字変更ができるようになりました。

以下、過去の紹介内容ですが、参考まで残しておきます。

-----------------------

文章項目内で「文字サイズの変更方法」と「文字サイズ＆色の変更方法」をご紹介します。

これは、文字の大きさを16pxにした例です。

これは、文字の色を赤にしてみました

これは、文字の大きさを18pxにして、色を赤にしています。

【変更方法】

１）HTMLが編集できる画面（HTMLソースエディタ）に切り替えます。

２）下記のHTMLソースを“コピペ”して使ってください。

文字のサイズを変える

font-size（フォントサイズ）の右の数字でサイズ指定します。pxは、ピクセルと読みます。

サイズを変えたい文字

↓ここから【コピペ】どうぞ♪

11px

11px

12px

13px

14px

16px

18px

21px

24px

28px

文字の色を変更する

色のみの変更は、ＨＴＭＬ画面を開かなくても、
文章の編集画面「A」をクリックすると指定できますので、通常はそれを使えばOKです。

ここでは、文字サイズを変えたらカラー設定がうまくいかない、なんて場合の参考まで、HTML編集画面での変更方法を紹介します。

パターンは、２つ。カラーネームの指定と16進法でコードを指定です。

パターン１：カラーネームで指定する。

colorの右にカラーネームを記入し、色指定します。

色を変えたい文字

↓ここから【コピペ】どうぞ♪

ここに色を変えたい文字・文章を入力

ここに色を変えたい文字・文章を入力

ここに色を変えたい文字・文章を入力

ここに色を変えたい文字・文章を入力

ここに色を変えたい文字・文章を入力

ここに色を変えたい文字・文章を入力る

ここに色を変えたい文字・文章を入力

パターン２：RGBの16進法で指定する。

RGBの16進数値で、色指定します。

colorの右にある#000000と、＃と6桁の英数がコードになります。

色を変えたい文字

↓ここから【コピペ】どうぞ♪

ここに色を変えたい文字・文章を入力

ここに色を変えたい文字・文章を入力

ここに色を変えたい文字・文章を入力

これは、沢山のパターンがあります。

その一部ですが、こちらの一覧でコードを確認して、#右の6桁を書きかえてご利用ください。

____	000000	____	111111	____	222222	____	333333	____	444444	____	555555
____	666666	____	777777	____	888888	____	999999	____	aaaaaa	____	bbbbbb
____	cccccc	____	dddddd	____	eeeeee	____
____	000000	____	000033	____	000066	____	000099	____	0000CC	____	0000FF
____	003300	____	003333	____	003366	____	003399	____	0033CC	____	0033FF
____	006600	____	006633	____	006666	____	006699	____	0066FF	____	0066FF
____	009900	____	009933	____	009966	____	009999	____	0099CC	____	0099FF
____	00CC00	____	00CC33	____	00CC66	____	00CC99	____	00CCCC	____	00CCFF
____	00FF00	____	00FF33	____	00FF66	____	00FF99	____	00FFCC	____	00FFFF
____	330000	____	330033	____	330066	____	330099	____	3300CC	____	3300FF
____	333300	____	333333	____	333366	____	333399	____	3333CC	____	3333FF
____	336600	____	336633	____	336666	____	336699	____	3366CC	____	3366FF
____	339900	____	339933	____	339966	____	339999	____	3399CC	____	3399FF
____	33CC00	____	33CC33	____	33CC66	____	33CC99	____	33CCCC	____	33CCFF
____	33FF00	____	33FF33	____	33FF66	____	33FF99	____	33FFCC	____	33FFFF
____	660000	____	660033	____	660066	____	660099	____	6600CC	____	6600FF
____	663300	____	663333	____	663366	____	663399	____	6633CC	____	6633FF
____	666600	____	666633	____	666666	____	666699	____	6666CC	____	6666FF
____	669900	____	669933	____	669966	____	669999	____	6699CC	____	6699FF
____	66CC00	____	66CC33	____	66CC66	____	66CC99	____	66CCCC	____	66CCFF
____	66FF00	____	66FF33	____	66FF66	____	66FF99	____	66FFCC	____	66FFFF
____	990000	____	990033	____	990066	____	990099	____	9900CC	____	9900FF
____	993300	____	993333	____	993366	____	993399	____	9933CC	____	9933FF
____	996600	____	996633	____	996666	____	996699	____	9966CC	____	9966FF
____	999900	____	999933	____	999966	____	999999	____	9999CC	____	9999FF
____	99CC00	____	99CC33	____	99CC66	____	99CC99	____	99CCCC	____	99CCFF
____	99FF00	____	99FF33	____	99FF66	____	99FF99	____	99FFCC	____	99FFFF
____	CC0000	____	CC0033	____	CC0066	____	CC0099	____	CC00CC	____	CC00FF
____	CC3300	____	CC3333	____	CC3366	____	CC3399	____	CC33CC	____	CC33FF
____	CC6600	____	CC6633	____	6CC6666	____	CC6699	____	CC66CC	____	CC66FF
____	CC9900	____	CC9933	____	CC9966	____	CC9999	____	CC99CC	____	CC99FF
____	CCCC00	____	CCCC33	____	CCCC66	____	CCCC99	____	CCCCCC	____	CCCCFF
____	CCFF00	____	CCFF33	____	CCFF66	____	CCFF99	____	CCFFCC	____	CCFFFF
____	FF0000	____	FF0033	____	FF0066	____	FF0099	____	FF00CC	____	FF00FF
____	FF3300	____	FF3333	____	FF3366	____	FF3399	____	FF33CC	____	FF33FF
____	FF6600	____	FF6633	____	FF6633	____	FF66999	____	FF66CC	____	FF66FF
____	FF9900	____	FF9933	____	FF9966	____	FF9999	____	FF99CC	____	FF99FF
____	FFCC00	____	FFCC33F	____	FFCC66	____	FFCC99	____	FFCCCC	____	FFCCFF
____	FFFF00	____	FFFF33	____	FFFF66	____	FFFF99	____	FFFFCC	____	FFFFFF