Tag: 伪元素
嵌套伪元素内的伪元素
我有一个：开幕前的“报价”和之后的一个结束报价。 现在我想要的是：之后：“引用”参考后，但我不能得到它的工作。 有谁知道这是可能的吗？ 我的代码到目前为止： – blockquote:before { content: '\201C'; } blockquote:after { content: '\201D'; } blockquote { font-size: 22px; line-height: 24px; text-indent:60px; } blockquote:before { font-size: 170px; margin-left: -136px; margin-top: 50px; opacity: 0.2; position: absolute; overflow:visible; float:left; width:135px; } blockquote:after { float: right; font-size: 170px; margin-right: 35px; margin-top: 33px; opacity: 0.2; overflow:visible; width:135px; } blockquote[cite]:after:after […]
为什么伪元素上的filter渐变在IE8中不起作用？
我想创build这样的button： 在现代浏览器中，使用插入框阴影和filter创build效果。 对于IE8 – select伪元素。 对于IE7 – 我使用包装在条件注释中的特殊标签。 演示： （ http://jsfiddle.net/8M5Tt/68/ ） /** * Button w/o images */ html { font-size: 62.5%; } body { font: normal 1em/1em Arial, Tahoma, Verdana, sans-serif; } /* layout */ .btn { display: inline-block; height: 28px; border-width: 1px; border-style: solid; width: 170px; box-sizing: content-box; overflow: hidden; position: relative; z-index: […]
我可以做的CSS：伪元素追加元素之外的内容？
我想使用HTML格式化一个面包屑path的链接» 相邻链接之间的实体，所以它看起来像这样： 首页 » 关于我们 » 历史 »此页面 我已经添加了一个规则到我的CSS： nav#breadcrumb-trail a:after { content: " » "; } 但是这是添加实体内部的链接，而不是在外面 – 即我得到这个： 首页» 关于我们» 历史»此页面 我误解了CSS的行为:after伪元素之后？ 文档似乎暗示它将指定的内容添加到指定元素之后，而不是将其预先添加到元素容器的内部。 有任何想法吗？
在CSS中的版权符号：在伪元素之后
已解决 – 使用\00a9而不是© 相当不言自明： body:after { content: "© me"; /* other formatting */ } 在HTML中， © 序列插入一个版权字符。 这可以做在CSS伪元素，就像我在这里试图做的？
为什么不：访问而不是：访问链接？
我看过的每个示例和样式表都使用a:visited来设置样式链接。 另外a:visited具有较高的特异性，不应该:visited相当简单？
如何覆盖伪元素的CSS设置？
我知道，之前已经问过，但我发现没有干净的方式覆盖这个CSS： .ui-input-search:after { content: ""; height: 18px; left: 0.3125em; margin-top: -9px; opacity: 0.5; position: absolute; top: 50%; width: 18px; } 我需要在元素上留下ui-input-search ，但可以添加我自己的类，如： .ui-input-search-no-pseudo:after { content: ""; } 问题 ： 有没有简单的方法来删除“伪css”，而不必逐行覆盖CSS行？ 谢谢！
将webkit滚动条样式应用于指定的元素
我是以双冒号为前缀的伪元素。 我遇到了一篇博客文章，讨论使用一些webkit的css滚动条样式。 伪元素CSS可以应用于单个元素吗？ /* This works by applying style to all scroll bars in window */ ::-webkit-scrollbar { width: 12px; } /* This does not apply the scrollbar to anything */ div ::-webkit-scrollbar { width: 12px; } 在这个小提琴中，我想使div的滚动条自定义，但主窗口的滚动条保持默认。 http://jsfiddle.net/mrtsherman/4xMUB/1/
强制IE8重新渲染/重新绘制：之前/：在伪元素之后
所以我一直在玩这个日历， div格子（模仿一张桌子） 将鼠标hover在表格单元格上，会显示一个带有2个图标的工具提示，每个图标都包含div：before和after元素 图标的颜色取决于hover的单元格的颜色和之前的同级单元格的颜色（单元格的颜色类别应用于图标）。 剥离小提琴： http : //jsfiddle.net/e9PkA/1/ 这在每个浏览器，但IE8和以下的工作正常（IE 7和我绝不会朋友，但IE8会很高兴）。 IE8注意到classNames的改变，并相应地更新了div的颜色，但完全忽略了之前和之后所暗示的颜色变化：在声明之后，例如： .wbscal_icon_arrival:before { width: 12px; height: 4px; left: -8px; top: 6px; background-color: silver; } .wbscal_icon_arrival.wbscal_full:before { background-color: #ff0000 !important; } 在上面的小提琴中，：之前/之后：元素仅被着色一次：第一次显示工具提示。 在另一个版本中，每次将鼠标移出“表格”div时都会更新，但是如果hover“单元格”div边框时隐藏了工具提示，则不会更新。 我尝试了强制触发重绘，通过添加/删除元素/它的父母/身体其他类，编辑/访问样式属性和whatnot所以我想这不是你的平均重绘问题。 有没有一个JS黑客修复这个和强制：之前/：更新之后？
如何删除只从下划线：之前？
我有一组样式的链接使用:before申请一个箭头。 它在所有浏览器中看起来都不错，但是当我将下划线应用到链接时，我不想:before部分（箭头）上加上下划线。 以jsfiddle为例： http : //jsfiddle.net/r42e5/1/ 是否有可能删除这个？ testing样式我坐在#test pa:hover:before得到应用（根据Firebug），但下划线仍然在那里。 任何方法来避免这种情况？ #test { color: #B2B2B2; } #test pa { color: #B2B2B2; text-decoration: none; } #test pa:hover { text-decoration: underline; } #test pa:before { color: #B2B2B2; content: "► "; text-decoration: none; } #test pa:hover:before { text-decoration: none; } <div id="test"> <p><a href="#">A link</a></p> <p><a href="#">Another link</a></p> </div>
我可以有多个：在同一个元素的伪元素之前？
是否有可能有多个:before相同元素的伪造:before ？ .circle:before { content: "\25CF"; font-size: 19px; } .now:before{ content: "Now"; font-size: 19px; color: black; } 我正在尝试将上述样式应用于使用jQuery的相同元素，但只应用最新的样式，从来都没有。
