I'm trying to apply CSS styles to some HTML snippets that were generated from a Microsoft Word document. The HTML that Word generated is fairly atrocious, and includes a lot of inline styles. It goes something like this:
<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>
...and very simply, I would like to style the first letter of the title section. It just needs to be larger and in a different font. To do this I am trying to use the :first-letter
selector, with something kind of like:
p b span:first-letter {
font-size: 500px !important;
}
But it doesn't seem to be working. Here's a fiddle demonstrating this:
http://jsfiddle.net/KvGr2/
Any ideas what is wrong/how to get the first letter of the title section styled correctly? I can make minor changes to the markup (like adding a wrapper div around things), though not without some difficulty.
Question&Answers:
os 与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…