问题标签 [css-content]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
css - CSS 属性内容的空值有什么作用？
""content 属性的值是什么意思？
html - 如何使用 CSS 内容跨浏览器将 HTML 文本替换为图像
所以我有一个由我的 CMS 生成的导航菜单：
菜单的 HTML 很简单（为清晰起见进行了编辑）：
我希望这些项目显示为手写文本，以符合网站的一般主题，为每个菜单项使用单独的 PNG 文件。
为此，我使用了 CSScontent属性，如下所示：
而且效果很好！每个项目的 HTML 文本都替换为正确的图像：
然而，唉，后来我了解到并不是每个浏览器都支持 content选择器上的属性，而不是:before和:after！Chrome 和 Safari 会这样做，但 Firefox 不会。但是，当我使用 :before时，不会替换 HTML 节点，而是添加了图像：
我该如何解决这个问题？
什么不起作用：
- 制作
<a>元素也display: none删除了:before部分。 - 制作
<a>元素position: absolute并将其移动到其他地方也不起作用。 - 使
<a>元素width: 0px搞砸了布局，因为通过添加的图像content不在文档流中。
我不想做的事情：
当然，我可以手动输出图像，但我想使用 CMS 给我的 HTML，其中
<li>包含文本。任何涉及的解决方案
background-image都需要我在样式表中指定每个项目的宽度和高度，出于这个问题的目的，我想避免这样做。将笔迹变成字体不是一种选择。
使用 JavaScript 动态替换项目不是一种选择。这需要使用纯 HTML 和 CSS 来工作。
html - 当父元素有边框时，从 :before 伪元素中删除底部边框
我正在为动态面包屑创建一组样式。
面包屑中的每一步都应该有一个边框底部和一个正斜杠。正斜杠作为 :before 完成。
问题是当前两个步骤之间有一个正斜杠时，右侧的边框没有间隙。
为了更好地解释这个问题，请看这个codepen... http://codepen.io/anon/pen/dJEen
我试过在 :before 上做一个border-bottom:0，但这什么也没做。我的代码：
HTML
CSS
任何帮助将不胜感激。
html - :before 如何在 CSS 中工作？
在代码中：
我正在尝试创建一个透明背景，如该线程中所述：如何在父 div 中设置不透明度而不影响子 div？.
查看第 4 个答案中的代码。这是如何工作的，我对.parentand的使用感到困惑.parent:before。我认为这会.parent:before在每个父元素之前创建一个元素。真的很困惑这是如何工作的？
html - css中内容和反斜杠是什么意思
我下载了一个带有站点下载器的站点，上面有漂亮的图标。但下载后，图标消失了，我看不到任何图像文件。
在html中是这样的。
该课程如下所示。
该类定义的含义是什么
和
html - 使用 :after 伪元素的图像叠加
我试图通过 after 属性将透明图像覆盖在另一个图像上。它甚至没有出现使用这种方法。如果可能的话，我想使用 base64 编码的图像。我也尝试使用常规的非编码图像。没有骰子。有人有什么想法吗？
我的 HTML：
我的 CSS：
html - :hover 如果悬停在 :before 伪生成内容上则不起作用
我正在使用 css 的组合:before并:hover在按钮中添加图像。
我遇到的问题是，当我将鼠标悬停在:before元素上时，它会正确触发图像位置更改，但不会触发li:hover创建:before元素的位置。我猜这是由于:before元素位于其顶部的方式导致的li，然后阻止了:hover触发。
这是一张图片，可以更好地解释正在发生的事情：
这是我的CSS：
和 HTML：
这是一个工作小提琴 http://jsfiddle.net/wf_4/B42SH/
html - css 内容中的 html 特殊字符，使用 attr()
相关codepen：http ://codepen.io/anon/pen/ocptF/
编辑：codepen 使用 Jade，因此搞砸了一些事情。开始这个问题时我没有意识到这一点。本质上，我认为 CSS attr() 会从字面上复制 HTML 属性，但事实并非如此。
我想使用 CSSattr函数来填充content一些伪元素。004但是，它会在 HTML 属性设置为 时打印出来\f004，并且08fa在\f08fa.
相关线路：
HTML：
CSS：
谢谢！
css - 如何在没有绝对定位的情况下使用生成的 :before 或 :after 进行 CSS 文本替换？
我试图让我们的 CMS 编辑器能够仅使用 css 覆盖来交换用于页面标题的文本。
使用 :before 或 :after 标签，可以使用许多可用的替代标题之一。
如果我们也可以说，
不幸的是，据我所知，没有隐藏“此页面的默认标题”以将其替换为“备用标题”的好方法。如果这是一个 Sprite，我们可以使用像 Phark 或其他方法这样的常用图像替换技术。由 :before 生成的文本替换并没有那么多，因为 :before 也受用于隐藏默认文本的 CSS 设备的影响，因此，例如，对于 Phark，:before 内容也是 -9999px。
我试图避免一些解决方案。
- 使用 Phark 方法或类似的方法隐藏默认文本，然后在 :before 内容上使用绝对定位将其放回左侧：0，顶部：0。如果可能，我希望/需要保留流量。
- 将“页面的默认标题”包装在一个跨度中，并在使用备用标题时将其设置为 display: none 在 CSS 中。
IE
这可行，但嵌套在标题中的跨度令人不快。
有没有办法针对标签的文本而不同时针对其生成的 :before/:after 内容？还有另一种方法可以做到这一点吗？