ホームCSS Tipsフォントと段落を…

フォントと段落を設定する

2018年10月30日2018年10月30日root

まず、外部*.cssを読み込ませてフォントを設定させる

以下setfont.cssファイル

/*タイトル用*/

p.fonttitle{font-size:36px;font-family:monospace;font-weight:600;line-height: 200%;}

/*小見出し用*/

p.fontmidasi{font-size:24px;font-family:monospace;font-weight:600;line-height: 200%;}

/*本文用*/

p.fontname{font-size:12px;font-family:monospace;font-weight:400;line-height: 200%;}

/*脚注用*/

p.fontnotes{font-size:10px;font-family:monospace;font-weight:600;color:#ff0000;line-height: 200%;}

でHTMLで読む

<html>
  <head>
    <link rel="stylesheet" href="setfont.css" type="text/css">
  </head>
<body>
  <p class="fonttitle">タイトル</p>
  <p class="fontmidasi">見出し</p>
  <p class="fontname">本文</p>
  <p class="fontnotes">脚注</p>
</body>
</html>

こんな感じ

CSS辞書

タイトル

見出し

本文

脚注