前回はCSSのルールについて記事を書きました。
今回はCSSの装飾について記事にしたいと思います。
CSSで装飾する時に使用するプロパティ
装飾については前々回 のCSS基本文法で伝えたプロパティを使用します。今回はたくさんあるプロパティの中から使用頻度が多いプロパティを記事にしたいと思います。
文字のサイズを変える『font-sizeプロパティ』
font-sizeプロパティは文字のサイズを変えるプロパティになります。こちらは前回のCSSルールでもあった通り値に単位を入力する必要があります(px・em・%など)。
font-sizeプロパティはページの基準となるhtmlタグ内に『font-size:100%』と入力することで文字の大きさをデフォルトにすることができます。
また、文字のサイズは14px〜16pxが基準となります。
文字のフォント(種類)を変える『font-familyプロパティ』
こちらのプロパティを使用するとフォントの種類を指定します。指定しない場合はデフォルトのフォントが表示されます。
フォントの種類:sans-serif(ゴシック系)、serif(明朝体)、cursive(筆記体)、fantasy(装飾系)、monospace(等幅)
また、web上で作成されたフォントはインストールしていないと表示することできません。(こちらは次の記事にします。)
文字の太さを変える『font-weightプロパティ』
こちらのプロパティではフォント太さを指定します。数値で指定することもできますが、通常は『normal(標準)』、『bold(太字)』、『lighter(細く)』、『bolder(一段階太字)』等で指定することが一般的です。
行間の高さを変える『line-heightプロパティ』
こちらは行間を指定する際に使用します。行間が狭いと感じたら大きい数字を行間が広すぎると感じたら小さい数字を指定すると見やすくすることができます。またオススメの数値は1.5〜1.9の間になります。
文章を揃える『text-alignプロパティ』
こちらはテキストを揃える際に使用します。基準は左揃えになっていますが、右揃え『right』、中央揃え『center』、両端揃え『justify』をそれぞれの値で指定することができます。また、左揃えの場合は『left』を値に指定します。
まだまだプロパティの種類はありますが今回は以上となります。次回はフォントの種類でありましたweb上のフォントの指定について記事にしたいと思います。