概要:
段落の最初の文字の拡大とは、主に CSS の最初の文字の擬似クラス セレクターを使用して、段落の先頭の文字または漢字を拡大することを指します。
単一行の拡大:最初の行を拡大します。効果は次のとおりです:
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style> body { background-color: #FFFFFF; color: #595959; } .contain { width: 150px; } .contain p { font: 80%/1.6 Verdana, Geneva, Arial, Helvetica, sans-serif; } .contain p:first-letter { font-size: 2em; padding: 0.1em; color: #000000; vertical-align: middle; } .contain p:first-line { color: red; } .contain p:first-child:first-letter { color: red; } .contain p:first-child:first-line { color: inherit; } </style></head><body> <div class="contain"> <p>This is a test article. This is a test article.</p> <p>This is a test article. This is a test article.</p> <p>这是一个测试</p> </div></body></html>注: 最初の文字は IE7+ をサポートし、最初の行は IE8+ をサポートします
複数行の拡大:The効果は次のとおりです。
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
