如何在HTML中增大段落首个单词的字号？

首先纠正一个误区：不存在<first letter>这种HTML标签，你提到的应该是CSS的::first-letter伪元素，它专门用来选中块级元素的第一个字母。

方法一：放大首个字母（纯CSS实现） #

利用::first-letter伪元素，无需额外HTML标签，直接给段落添加样式：

<style>
  p::first-letter {
    font-size: 2em; /* 字号设为默认的2倍 */
    font-weight: bold; /* 可选，加粗增强视觉效果 */
    margin-right: 4px; /* 字母和后续文本留出间距 */
  }
</style>
<p>hello world，这是一段测试文本，首个字母会被放大。</p>

方法二：放大首个单词（HTML+CSS结合） #

CSS没有原生的“选中首个单词”的伪元素，所以需要用<span>标签包裹首个单词，再通过类名设置样式：

<style>
  .first-word {
    font-size: 1.8em;
    color: #2c3e50; /* 可选，改变颜色 */
  }
</style>
<p><span class="first-word">Hello</span> world，这是一段测试文本，首个单词会被放大。</p>

如果想要纯CSS尝试选中首个单词，可以用::first-line配合word-spacing的技巧，但兼容性和可靠性不如HTML包裹的方式，不推荐在生产环境使用。

内容的提问来源于stack exchange，提问作者Nisha