CSS initial-letter属性，嗯……也就这样吧
内容提要
Chrome 110开始支持CSS initial-letter属性，用于设置首字母占据多少行文本的高度。但在中文场景下不实用。
延伸解读
英文排版中的实用价值
initial-letter属性主要针对英文排版中首字母放大的需求。传统使用::first-letter伪元素配合font-size放大首字母时，由于只能占据一行内联元素的高度，容易导致上下对齐问题或空白间隙。initial-letter允许首字母占据多行文本高度，并控制下沉行数，从而改善多行文本中的首字母排版效果。
中文场景的局限性
在中文场景下，首个文字放大展示并不符合排版习惯，通常只有图形或特定引用场景需要放大引号等符号。然而，::first-letter伪元素无法匹配引号字符，因此initial-letter属性在中文环境中难以发挥作用。此外，该属性只能用于::first-letter伪元素，而该伪元素支持的CSS属性有限，无法精确定位。
替代方案与兼容性
若需要实现类似首字母放大的效果，使用::before伪元素结合float环绕是更灵活的选择，还可以通过shape-outside属性实现不规则环绕布局。兼容性方面，Chrome和Safari已支持initial-letter，但Safari需要添加-webkit-前缀，Firefox尚未支持。总体而言，该属性应用场景较少，了解即可。
Q&A
CSS initial-letter属性的主要功能是什么？
CSS initial-letter属性用于设置首字母占据多少行文本的高度，解决多行排版问题。
initial-letter属性的语法是什么？
initial-letter属性支持1~2个数值，必须大于0，例如initial-letter: 2或initial-letter: 3 2。
哪些浏览器支持CSS initial-letter属性？
目前Chrome和Safari浏览器支持initial-letter属性，Firefox尚不支持。
在中文排版中，initial-letter属性的实用性如何？
在中文场景下，initial-letter属性不实用，放大首字母效果奇怪且无法匹配引号字符。
为什么说initial-letter属性的应用场景有限？
因为initial-letter属性只能用于::first-letter伪元素，且支持的CSS属性有限，无法精确定位。
如何替代initial-letter属性实现类似效果？
可以使用::before伪元素结合float环绕效果来实现类似的排版效果。
