CSS #08 フォント関連

  • このエントリーをはてなブックマークに追加
  • LINEで送る

 

こんにちは!
UPSTARTSのSベンです!

 

今回は「フォント関連」のスタイルについての内容です。

こちらのhtmlにスタイルをあてていきます。

 

 

color

まずはcolorですが、こちらは「文字色」の指定になります。

 

このように色名を指定して書く事もできますし、#で指定することもできます。

 

 

font-size

次にfont-sizeですが、こちらは「文字サイズ」の指定になります。

pxかem、%などで指定することができます。

 

このようにpxを指定すると、文字をその通りのサイズにすることができます。

 

 

font-weight

次にfont-weightですが、こちらは「文字の太さ」の指定になります。

値は数値で指定するか、キーワードで指定するかのどちらかになります。

 

数値ですと100~100ごとに900までが指定でき、数値が大きいほど文字が太くできます。
キーワードですと、nomal, bold, lighter, bolderを指定できます。

nomalが標準で数値だと400と同じ、boldが一般的な太さで数値だと700と同じになります。
lighterが相対的に一段階細くでbolderが相対的に一段階太くになります。

 

今回はよく使われるboldを指定します。

 

こうすると、文字が太く表示されます。

 

 

font-family

次にfont-familyですが、こちらは「字体」の指定になります。

今回は「Times New Roman」という字体にしてみます。

 

いかした字体になったかと思います。

字体の種類はたくさん用意されていますので、
お好みの字体を使ってみるのもいいかもしれません。

 

 

 

 

 

 

 

今回はフォント関連についてやっていきました。

次回は「ボックスモデル」になります。

 

ではまた次回!


  • このエントリーをはてなブックマークに追加
  • LINEで送る