我正在尝试对从 Microsoft Word 文档生成的一些 HTML 片段应用 CSS 样式。Word 生成的 HTML 很糟糕,包含许多内联样式,大致如下:
<html>
<head></head>
<body>
<center>
<p class=MsoNormal><b style='mso-bidi-font-weight:normal'><span
style='font-size:12.0pt;line-height:115%;font-family:"Times New Roman"'>Title text goes here<o:p></o:p></span></b></p>
<p class=MsoNormal style='margin-left:18.0pt;line-height:150%'><span
style='font-size:12.0pt;line-height:150%;font-family:"Times New Roman"'>Content text goes here.<o:p></o:p></span></p>
</body>
</html>
很简单,我想要给标题部分的第一个字母添加样式,让它变得更大并使用不同的字体。为此,我尝试使用:first-letter
选择器,类似于以下代码:
p b span:first-letter {
font-size: 500px !important;
}
但似乎它并没有起作用。这里有一个演示:
有任何想法是出了什么问题或如何使标题部分的第一个字母正确地样式化?我可以对标记进行微小更改(例如在各个位置添加包装器div),尽管不容易。
span
元素应该是很常见的,所以我很惊讶它不能正常工作。 - Yuck