html – 影响大纲的伪元素

概述参见英文答案 > Weird behavior in Firefox with outlines and pseudo-elements                                    2个 很确定这是Firefox的一个错误,但也许有人可以权衡. 我正在应用100×100盒子周围的轮廓.当您使用绝对定位的伪元素时,它应该从文档流中删除它,但它似乎仍然影响outline属性的 参见英文答案 > Weird behavior in Firefox with outlines and pseudo-elements                                    2个
很确定这是firefox的一个错误,但也许有人可以权衡.

我正在应用100×100盒子周围的轮廓.当您使用绝对定位的伪元素时,它应该从文档流中删除它,但它似乎仍然影响outline属性的流. IE和Chrome似乎正如我所料那样渲染它,黑色轮廓保持定位于主元素.有任何想法吗？

.content{  wIDth:100px;  height:100px;  outline:1px solID black;  border:1px solID yellow;  position:relative;}.content:after{  position:absolute;  content:'pseudo';  background-color:salmon;  wIDth:200px;  top:150px;}

<div class='content'></div>

http://jsbin.com/gatupogiwi/1/edit?html,output

解决方法 您可以将轮廓样式更改为Box-shadow：

outline:1px solID black;

至：

Box-shadow: 0px 0px 0px 1px black;

总结

以上是内存溢出为你收集整理的html – 影响大纲的伪元素全部内容，希望文章能够帮你解决html – 影响大纲的伪元素所遇到的程序开发问题。

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