CSSスキル - 第3章 Lesson6

文字の太さを変更するfont-weightの書き方

   

テクノロジーとクリエイティブのプロを目指す人のためのオンラインスクール
月額2500円で500以上のレッスンが受けられます

このスキルのデータをダウンロード: Windows Mac

font-weightプロパティを利用して、文字の太さを変更するCSSをかける方法について、初心者向けに解説しています。



この動画で学べること

・フォントの太さを変更する方法



フォントの太さを変更する方法

フォントの太さを変更するために使うのは、font-weight というプロパティです。
値に100〜900の9段階で指定する、または太字「bold」や細字「ligter」、普通の「normal」で文字の太さを定義していきましょう。
では実際にやってみましょう。
今回は<div>タグの中の<p>に対してfont-weight: bold;を、<div>タグの中の<h2>に対してfont-weight: normal;をかけてみましょう。




div p {
font-weight: bold;
}


div h2 {
font-weight: normal;
}




保存してブラウザで見てみましょう。
文字の太さが変わったことがわかります。