「CSS」font-familyでフォントを指定するサンプル

2014年12月17日2021年8月24日

書式
/* 総称ファミリ名のみ */
font-family: serif;
font-family: sans-serif;
font-family: monospace;
font-family: cursive;
font-family: fantasy;
font-family: system-ui;
font-family: ui-serif;
font-family: ui-sans-serif;
font-family: ui-monospace;
font-family: ui-rounded;
font-family: emoji;
font-family: math;
font-family: fangsong;

使用例

<style>
  .cftA {
    font-family: "メイリオ";
  }
  /* 明朝系に相当 */
  .cftB {
    font-family: serif;
  }
   /* 等幅のフォント */
  .cftC {
    font-family: monospace;
  }
  p {font-size: 24px;}
  div {font-size: 40px;}
</style>
<p class="cftA">11111　メイリオ</p>
<p class="cftB">222222　明朝系</p>
<div class="cftC">33333　等幅のフォント</div>