文字を変える

文字の大きさを変える

文字の大きさを変えるにはfont-sizeプロパティを使います。
p{font-size:10px;}

値には10pxといったような絶対サイズと親要素でフォントサイズの大きさがきまる相対サイズがあります。

大きさを表す単位

px　ディスプレイの解像度に依存する
%　文字の大きさや親要素の大きさなどを「100％」とする
em　その要素に指定された文字サイズを基準にする

文字の色を変える

文字の色を変えるにはcolorプロパティを使います。
p{color:red;}

色の指定

カラーコード

redやgreenのように文字で指定できるものもあるがカラーコードを使用することで細かい色の指定ができる
カラーコードは16進数を使う
16進数は0～9,a,b,c,d,e,fの16桁で表示され、色の表現ができる。

color: #0cf5ce;など

RGBaカラーコード

10進数を使用し0~255の数値で指定する
最後の0.5は透明度を指定できる値で、1が透明度0になる。

文字の種類を変える

文字の種類を変えるにはfont-familyプロパティを使用します。
h2{font-family:serif;}
p{font-family:”wise bright”;}

フォント名にスペースがある場合はダブルクォーテーションで囲みましょう。

一部の文字を変える

文中の一部の文字にCSSを適用させたい場合は<span＞タグを使用します。

文字の配置を変える

text-alignを使用することでテキストなどのインライン要素やインラインブロック要素の配置を指定できます。

p{text-align:center;}

centerで中央、leftで左寄せ、rightで右寄せに設定できます。

文字の太さを変える

font-weightプロパティを使用することで文字の太さが変更できます。
p{font-weight:bold;}

normal、boldを指定する。

100や200などの数値をしてすることはできるが、対応しているフォントが少ない。
<h1>～<h6>タグでは、初期状態でboldが指定されている。