问题标签 [pseudo-element]

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.

0 投票
2 回答
301 浏览

javascript - javascript 可以选择未在 DOM 上显示的对象吗?

这是一个非常快速的问题:)

只是想知道 javascript 是否有可能选择不属于 DOM 的对象......比如选择由 CSS 创建的:after或内容?:before

例如...如果我有一个 div 并通过创建一个框

我仍然很难理解这些元素是如何创建的,并且由于它们可以在屏幕上绘制元素但不是它们 DOM 的一部分,这是否意味着无法与它们交互?

干杯

0 投票
1 回答
3506 浏览

html - 在 ' 元素上使用 :before 伪元素 - 可以吗?

我有兴趣看看是否可以在包裹:before元素上使用伪元素?<a href<button>

目前,Firefox 在元素后面显示一条细蓝线<button>- 这是因为它被包裹在<a href.

如果我在该行中使用内联样式,则<a href该行消失:

但是,由于我<button>在多个页面上都有元素,因此如果可能的话,我想使用CSS来定位它们(​​而且我并不特别想去为网站上所有<a href包装<button>'s 的内容添加一个类)。这是我认为:before伪元素会派上用场但它似乎不起作用的地方:

这就是<button>Firefox 在 Firefox 中的显示方式,请参阅应用于<a href. 它只显示在右侧的原因是因为一个类margin-left:5px应用于<button>元素:

在此处输入图像描述

这是 jsfiddle 上按钮的基本版本(忽略轻微的外观差异):http: //jsfiddle.net/Vtjue/2/

有任何想法吗?

0 投票
25 回答
778922 浏览

javascript - 使用 javascript(或 jQuery)选择和操作 CSS 伪元素,例如 ::before 和 ::after

有没有办法使用 jQuery 选择/操作 CSS 伪元素,例如::before::after(以及带有一个分号的旧版本)?

例如,我的样式表有以下规则:

如何使用 vanilla JS 或 jQuery 将 'foo' 更改为 'bar'?

0 投票
3 回答
13430 浏览

css - 在css中添加填充到:before伪元素

任何人都知道如何在 :before 伪元素和内容实际开始的位置之间添加填充?

我只希望第一个 li 有一个要点,并且只有它有一个强大的元素。

我已经正确使用:

谢谢大家!

0 投票
2 回答
218 浏览

css - 有什么方法可以修复 Chrome 中的 CSS3 内容属性闪烁?

我创建了一个使用这种样式的页面:

大多数时候,li除了最后一个元素之外,我希望在元素之前添加一个“/”。

问题是在 Chrome 中(仅据我所知),我有时会看到“/”的一点点闪烁,即使它不应该存在。它出现片刻然后消失。

其他人看到过这个或解决过它吗?

0 投票
3 回答
32394 浏览

html - 我可以让 CSS :after 伪元素在元素之外附加内容吗?

我想&raquo;在相邻链接之间使用 HTML 实体格式化链接的面包屑路径,所以它看起来像这样:

主页»关于我们»历史» 本页

我在我的 CSS 中添加了一条规则:

但这是在链接内部添加实体,而不是在链接外部 - 即我得到这个:

主页 » 关于我们 »历史 »本页

我是否误解了 CSS:after伪元素的行为?文档似乎暗示它在指定元素之后添加指定内容,而不是将其添加到元素容器的内部。有任何想法吗?

0 投票
9 回答
608349 浏览

css - CSS :not(:last-child):after 选择器

我有一个元素列表,其样式如下:

输出One | Two | Three | Four | Five |而不是One | Two | Three | Four | Five

任何人都知道如何 CSS 选择除最后一个元素之外的所有元素吗?

您可以在此处:not()查看选择器的定义

0 投票
3 回答
1777 浏览

css - 在 Firebug 中处理伪元素的 CSS 样式

是否可以操作伪元素的 CSS:before:after使用 Firebug?我知道这些是浏览器内部处理的特定元素,但 Firebug 具有更多低级访问权限(我想),所以它也许也有能力操纵这些元素。

0 投票
1 回答
16329 浏览

css - CSS 的奇怪行为:first-child:before 在 Chrome

我在 Chrome 10 w/ 中看到了一些相当奇怪的东西:first-child:before

有了这个 HTML

这个CSS

谁能解释为什么<li>Four</li>在 Win XP SP3 的 Chrome 10.0.648.204 中用星号渲染?见http://jsfiddle.net/MxtHm/

但是如果我将 CSS 更改为

<li>Four</li>渲染没有星号。见http://jsfiddle.net/SGRej/

Safari 5.0.4 和 Firefox 3.6.16 呈现两个示例相同。我已经阅读了 Meyer 的书和 CSS 规范来寻找解释,但没有任何运气,而且 CSS 验证器并没有抱怨 CSS。

非常奇怪的是,如果我在 Chrome 中检查元素,它表明它li:first-child:before正在覆盖li:before规则。

JSFiddle 使用的是 XHTML 1.0 Strict DOCTYPE,但我也看到了 HTML5 DOCTYPE。

谢谢。

2011-04-28 编辑:这似乎已在 Chrome 11.0.696.57 中修复,以及其他类似的伪元素相关问题。

0 投票
1 回答
3778 浏览

javascript - Javascript 查找伪元素

所以我一直在研究CSS 选择器引擎,我想支持伪元素(::before、::after、::selection、::first-line 等)。我注意到 Slick、Sizzle 和其他一些流行的引擎似乎支持它们,但是在查看它们的代码时,我没有发现它的代码(现在承认,我看起来并不那么努力)。有谁知道他们是怎么做到的,或者我可以通过什么方式做到这一点?