html–CSS :: before is invalidifying :: first-letter

概述Html代码：<h1>Example title</h1> CSS：h1::first-letter{ display:none; } h1::before{ content: url(http://icons.iconarchive.com/icons/ariil/alphabet/32/Letter-E-icon.

Html代码：

@H_419_6@

CSS：

@H_419_6@h1::first-letter{    display:none;}h1::before{    content: url(http://icons.iconarchive.com/icons/ariil/Alphabet/32/Letter-E-icon.png);}

我的问题是：为什么::之前是杀人::第一封信规则？这里发生了什么？如果:: before被删除,:: first-letter工作正常.

是否有任何替代方法可以在不更改HTML的情况下定位此示例中的第一个字母？

http://jsfiddle.net/Borachio/kvaxmhth/最佳答案从the spec开始：

After the rule @H_419_6@p::before {content: "Note: "},the selector
@H_419_6@p::first-letter matches the "N" of "Note".

另请注意,display属性在first-letter和：first-line伪元素上无效.再次,从规范：

A future version of this specification may allow this pseudo-element
to apply to more display types.

这是预期的行为.

解决方法：

HTML：

@H_419_6@

和CSS：

@H_419_6@h1{    display: inline-block;}h1::first-letter{    Font-size: 0px;}div::before{    content: url(http://icons.iconarchive.com/icons/ariil/Alphabet/32/Letter-E-icon.png);}

演示：http://jsfiddle.net/kvaxmhth/3/ 总结

以上是内存溢出为你收集整理的html – CSS :: before is invalidifying :: first-letter全部内容，希望文章能够帮你解决html – CSS :: before is invalidifying :: first-letter所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。