css-selectors 相关问题

选择器是与文档树中的元素匹配的模式。在CSS规则中,它们用于为与模式匹配的元素定义样式。

子选择器未选择[重复]

不工作我的意思是我显然误解了它的使用方式。我只想选择位于描述内部的预标记。 p.description > pre{颜色:红色} 不工作我的意思是我显然误解了它的使用方式。我只想选择描述中的预标记。 p.description > pre{color:red} <p class="description"> <pre> adsfasdf asdf asdf asdf asdf asf sd f</pre> </p> 本例中 pre 的父级是 p.description 那么为什么不选择它呢?我在这里查看了许多其他帖子,但我不知道我可能做错了什么。 您是否明确需要父容器是 p? 如果没有,请尝试将其更改为div: div.description pre { color: red; } <div class="description"> <pre> adsfasdf asdf asdf asdf asdf asf sd f</pre> </div>

回答 1 投票 0

仅将鼠标悬停在元素的::first-line 时如何应用样式?

我想仅当用户将鼠标悬停在段落的第一行上时才将段落的第一行设为粗体。我尝试过类似的事情: p::第一行:悬停{ 字体粗细:粗体; } 请注意...

回答 1 投票 0

有没有办法在元素悬停时将样式应用于 CSS ::first-line 伪类

我一直在为 HTML 标记修改一些 CSS。我面临的问题是已经使用 CSS ::first-line 伪类应用了一种样式。我想要的是改变这个的风格

回答 3 投票 0

CSS 选择器具有相同的属性和多个值,会导致性能问题吗?

我对想到的一个问题有点好奇,尽管以这种方式编写男女混合并不是标准/良好的做法。 如果 CSS 选择器具有相同的属性和多个用于考试的值怎么办...

回答 1 投票 0

CSS 中的第一个子选择器工作但最后一个子选择器不起作用

我正在尝试制作图像滑块。所以我做了两个按钮来切换到下一张图像。问题是图像切换按钮没有到位。 css :first-child 选择器工作但不工作...

回答 1 投票 0

无法在外部样式表中实现flex-wrap、grid

-- 我有一个作业提供来自 HTML 页面和外部 CSS 样式表的代码,我不应该更改 HTML 代码或创建任何新的样式表选择器,只添加属性:value...

回答 1 投票 0

具有多个选择器的 CSS 最后类型

我想使用last-of-type选择两个元素,但我不知道正确的语法是什么。如果这是 html: 我想使用last-of-type选择两个元素,但我不知道正确的语法是什么。如果这是 html: <div class="Box"> <book class="small"/> <book class="small"/> <notes/> <notes/> <toy class="small"/> <toy class="small"/> </div> 我想选择盒子里的最后一本书和最后一个玩具,语法是什么?我以为会是: div.Box book.small, toy.small:last-of-type { } 但这显然是不正确的。 尝试 div.Box book.small:last-of-type, div.Box toy.small:last-of-type { /* styles */ } 这是一个小提琴。 您必须将属性 last-of-type 应用于两个选择器: div.Box book.small:last-of-type, toy.small:last-of-type 自 2021 年 1 月以来,现在支持跨浏览器的 :is() 和 :where() 伪选择器允许您通过结合这两个规则来进一步改进: div.Box :is(book,toy).small:last-of-type { /* styles */ }

回答 3 投票 0

嵌套 CSS 声明,是否可能且正确?

我可以将声明嵌套在另一个选择器中吗? TD:悬停 { 背景颜色:深蓝色; 白颜色; 边框颜色:紫色; 文本装饰:双下划线; 图像 { 边框: 固体...

回答 1 投票 0

Python-Selenium:Chrome 无头设置不适用于“WebDriverWait”

以下代码可以在真实浏览器中通过,但在无头浏览器中则不行。 而真实: 尝试: #明确等待 打印(“尝试4”) WebDriverWait(驱动程序, 10).until(EC.

回答 3 投票 0

当子元素只有:focus-visible时,如何获取父元素:focus-within?

当子元素只有焦点可见时,如何让父元素获得焦点? 我希望父母在通过键盘聚焦孩子时获得轮廓。 但这段代码总是有焦点(大纲)...

回答 1 投票 0

CSS3奇数和偶数仅可见行

我正在尝试条纹交替元素的颜色。但我希望行颜色仅交替可见行。如果您看一下下面的内容,这是我尝试让它工作的尝试...

回答 4 投票 0

CSS选择器-如何定位父元素

有没有办法在CSS选择器中定位父元素? 我正在使用下面的代码,但我没有获取父元素。 WebElement we=dr.findElement(By.cssSelector("div[id='gf-BIG']:parent")); ...

回答 4 投票 0

CSS @supports (::伪元素)

我想将区域更改为最大溢出:仅在支持 ::-webkit-scrollbar-thumb 时才滚动。 在纯 CSS 中这可能吗?看来 @supportsonly 检查规则,没有选择器。

回答 4 投票 0

CSS 子选择器 (>) 不适用于某些属性

当我尝试使用“>”将某些 CSS 属性应用于父元素的直接子元素时,它与某些属性(如边框)配合得很好,但不适用于字体属性(如 col)...

回答 5 投票 0

偶数和奇数级别子级的选择器

选择偶数和奇数级别子级的正确选择器是什么? 我想简化当前的 CSS,同时允许无限级别,而无需手动为它们编写 CSS。 .b...

回答 5 投票 0

用于组合谓词的剧作家选择器

我需要在 li 中找到在其子项中包含文本 6:00pm 和文本 Alpha 的按钮。 下午6:00 阿尔法 我需要在 button 中找到 li,其子级中包含文本 6:00pm 和文本 Alpha。 <li> <div>6:00pm</div> <div>Alpha</div> <button>Do it!</button> </li> <li> <div>6:00pm</div> <div>Beta</div> <button>Do it!</button> </li> ... 我有 li:has(div:text("6:00pm")) button 这为我提供了“6:00pm”的两个button,但是如何限制选择器也匹配Alpha,这样我就只能得到一个按钮? 我基本上需要在谓语中添加一个连词。 您可以组合 filter 调用来创建条件的逻辑“与”: const playwright = require("playwright"); // ^1.30.0 const html = `<!DOCTYPE html> <li> <div>6:00pm</div> <div>Alpha</div> <button>Do it!</button> </li> <li> <div>6:00pm</div> <div>Beta</div> <button>Do it!</button> </li>`; let browser; (async () => { browser = await playwright.chromium.launch(); const page = await browser.newPage(); await page.setContent(html); const btn = page .getByRole("listitem") .filter({hasText: "Alpha"}) .filter({hasText: "6:00pm"}) .getByRole("button"); console.log(await btn.textContent()); // => Do it! })() .catch(err => console.error(err)) .finally(() => browser?.close()); 虽然这些不使用首选角色定位器并预设文本顺序,但以下也是可能的: page.locator("li:text('6:00pm Alpha') button"); page.locator("li:has-text('6:00pm Alpha') button");

回答 1 投票 0

带有 css 选择器的渐变文本

我有这样的代码结构。我想对 3 个字母应用渐变,但它是单独应用的。那看起来不太好。我不想改变结构,因为我在动画中使用了它。 .

回答 1 投票 0

如何通过querySelectorAll(selector)获取一级子级

如果我们有一个包含嵌套 UL 列表的 UL 列表,例如 项目 子项目 我们需要...

回答 1 投票 0

::first-letter 不算 `@` 并以 2 个字母应用 css

玩耍时::first-letter 当字符串以 @ 开头时,它会为 2 个字母着色。 页脚 { 颜色:中海绿色; 字体大小:2rem; 字体样式:斜体; } 页脚::第一个字母 { 颜色: pu...

回答 1 投票 0

::first-letter 不算 `@` 并以 2 个字母应用 cdd

玩耍时::first-letter 当字符串以 @ 开头时,它会为 2 个字母着色。 页脚 { 颜色:中海绿色; 字体大小:2rem; 字体样式:斜体; } 页脚::第一个字母 { 颜色: pu...

回答 1 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.