「CSS」 font-weightで文字の太さを英字で指定するサンプル

2021年8月24日

書式
font-weight:(normal,bold,lighter,bolder)

使用例

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
<style>
.cftA {
/* 標準 */
font-weight: normal;
}
/* 太字 */
.cftB {
font-weight: bold;
}
/* 継承値の太さより細い */
.cftC {
font-weight: lighter;
}
/* 継承値の太さより太い */
.cftD {
font-weight: bolder;
}
</style>
<p class="cftA">data 1111l</p>
<p class="cftB">data 22222</p>
<div class="cftC">data 3333</div>
<div class="cftD">data 444</div>
<style> .cftA { /* 標準 */ font-weight: normal; } /* 太字 */ .cftB { font-weight: bold; } /* 継承値の太さより細い */ .cftC { font-weight: lighter; } /* 継承値の太さより太い */ .cftD { font-weight: bolder; } </style> <p class="cftA">data 1111l</p> <p class="cftB">data 22222</p> <div class="cftC">data 3333</div> <div class="cftD">data 444</div>
<style>
  .cftA {
   /* 標準 */
    font-weight: normal; 
  } 
  /* 太字 */
  .cftB {
    font-weight: bold; 
  } 
  /* 継承値の太さより細い */
  .cftC {
    font-weight: lighter; 
  }
  /* 継承値の太さより太い  */
  .cftD {
    font-weight: bolder; 
  }
</style>
<p class="cftA">data 1111l</p>
<p class="cftB">data 22222</p>
<div class="cftC">data 3333</div>
<div class="cftD">data 444</div>

 

CSS

Posted by arkgame