「CSS」first-letterで最初の1文字にCSSを適用する

2021年8月25日

書式
クラス名::first-letter{xxx}
使用例

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
<style>
.cft::first-letter {
color: skyblue;
font-size:20px;
/*大文字*/
text-transform: uppercase;
}
</style>
<p class="cft">
aaa 最初の1文字目にスタイルシートを適用<br />
bbb <br />
ccc
</p>
<p class="cft">eee 最初の1文字目にスタイルシートを適用<br>
EEEE
</p>
<style> .cft::first-letter { color: skyblue; font-size:20px; /*大文字*/ text-transform: uppercase; } </style> <p class="cft"> aaa 最初の1文字目にスタイルシートを適用<br /> bbb <br /> ccc </p> <p class="cft">eee 最初の1文字目にスタイルシートを適用<br> EEEE </p>
<style>
  .cft::first-letter {
    color: skyblue;
    font-size:20px;
    /*大文字*/
    text-transform: uppercase;    
  }
</style>
<p class="cft">
  aaa 最初の1文字目にスタイルシートを適用<br />
  bbb <br />
  ccc
</p>
<p class="cft">eee 最初の1文字目にスタイルシートを適用<br>
EEEE
</p>

 

CSS

Posted by arkgame