css-selectors 相关问题

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

我很难向最后一个 class="list-group" 中的最后一个 class="separator" 添加边框。我想在 SASS 中执行此操作。有人可以帮助我吗，因为我的解决方案不起作用。超文本标记语言 &l...

sass css-selectors

回答 2 投票 0

我有一个父元素，它有很多子元素。在遍历它们时，如果我需要选择一个子元素，我将使用以下代码： cy.get(root-div > div:nth-child(1)) 那个... 我有一个父元素<div>，它有很多子元素。在遍历它们时，如果我需要选择一个子元素，我将使用以下代码： cy.get(root-div > div:nth-child(1)) 然后我必须获取第二个元素，我将使用以下代码： cy.get(root-div > div:nth-child(2)) 我们可以让这个div:nth-child(2)部分像这样动态化吗： cy.get(root-div > div:nth-child(${0})) 即当我们调用这个定位器时插入索引值？这样定位器就变成动态的并且可以用于所有子元素。您可以创建一个 JavaScript 函数来返回该字符串，并让它接受索引变量。 const getNthChild(index) => { return `root-div > div:nth-child(${index})` }); // In test cy.get(getNthChild(1)); 此外，如果您的 cy.get() 命令生成多个元素，则 cy.eq() 命令可以选择索引处的元素。 cy.get('root-div > div').eq(1).should('be.visible') cy.get('root-div > div').eq(2).should('have.text', 'foo'); 或者，您可以创建自定义 Cypress 命令，尽管我认为这有点过分了。 Cypress.Commands.add('getNthChild', (index) => { return cy.get(`root-div > div:nth-child(${index})`); }); // In test cy.getNthChild(1);

javascript css css-selectors cypress

回答 1 投票 0

是否可以在 CSS3 选择器中使用 CSS 变量？

我正在尝试使用 CSS 变量进行一些实验，但我无法让它工作或找到任何有关它的文档。有谁知道是否可以在 CSS3 选择器中使用 CSS var？我做了以下...

html css css-selectors css-variables

回答 2 投票 0

检查 CSS 选择器是否有效

我有一个供用户输入 CSS 选择器的字段，我想检查它是否有效（根据 css3 规范）。我尝试按照另一个

javascript css-selectors

回答 5 投票 0

未捕获的 DOMException：无法在“CommandLineAPI”上执行“$”：不是有效的选择器

我正在使用 selenium 为我的网页编写自动化 UI 测试。我正在测试的网页上有一个元素： << input type="checkbox" id="screening_questions[0].multiple_choice[0]-

selenium dom selenium-webdriver xpath css-selectors

回答 2 投票 0

播放按钮不适用于@videogular/ngx-videogular v5.0.1

我最近将项目的 Angular 版本从 9 升级到了 13。由于此版本不再支持 videogular2 软件包，因此我将应用程序迁移为使用 @videogular/ngx-videogular ，并且我

html angular dom css-selectors videogular2

回答 1 投票 0

为什么对 CSS 选择器使用第一个/最后一个顺序会在 rvest 中返回错误？

我正在尝试抓取一个有几个按钮的页面。我想选择/单击最后一个按钮。使用 Chrome 的选择器小工具扩展，我可以通过添加 :last at ...

r web-scraping css-selectors rvest

回答 1 投票 0

谷歌地图评论抓取

我正在尝试从企业链接列表中抓取谷歌地图评论。我在为评论数据选择正确的选择器时遇到错误，因为不同的链接和评论 xpath 有所不同。有吗

python google-maps xpath css-selectors

回答 1 投票 0

使用CSS Target突出显示父div

我在我的网站中使用 Ckeditor 来插入文章。这些文章通常来自 Word 文档，并且有脚注。在最新的 Ckeditor 版本 (7125) 中，我已经能够从文章中链接...

css css-selectors target

回答 3 投票 0

Python Selenium 脚本无法从网页检索产品价格

我正在尝试使用 Python 和 Selenium 从 Ultra Liquors 网站上抓取产品价格，但尽管 HTML 包含预期元素，但我无法检索价格。我的目标是...

python selenium-webdriver web-scraping css-selectors webdriver

回答 1 投票 0

如何使用 JavaScript 在 Odoo12 Tour 测试中选择动态生成的下拉项？

我一直在进行自定义 Odoo12 巡回测试，并且在从动态生成的下拉列表中选择项目时遇到了问题。以下是我尝试实施的步骤的详细说明：我...

javascript testing css-selectors odoo odoo-12

回答 1 投票 0

如何更改伪选择器的优先级

CSS： #容器>一个{ 颜色：黄色！重要； } a:焦点可见 { 颜色：红色！重要； } HTML：锚1 ... CSS： #container > a { color: yellow!important; } a:focus-visible { color: red!important; } HTML： <div id="container"> <a href="#">Anchor 1</a> <a href="#">Anchor 2</a> </div> 我们都知道，当我们关注锚点时，文本颜色仍然是黄色，因为第一个选择器更具体。这很奇怪，我认为这是一个错误，因为 :focus-visible （以及其他伪选择器，如 :hover）是一种不同的状态，就像单击事件一样。对我来说，这就像当我单击一个元素时调用 onchange 处理程序。无论如何，这是完全不同的话题来讨论。我的问题是，如何使“a:focus-visible”选择器具有高优先级？ #container > a:focus-visible 可能是正确的答案。但是，考虑一下我的页面中有很多案例，我的用户仍然可以像第一个一样添加选择器。我需要在所有锚点上推行我自己的规则。您可以通过将选择器修改为比 #container > a 更具体来增加 :focus-visible 规则的特异性。由于 #container > a 具有更高的特异性，因此向 a:focus-visible 添加 ID 或另一个选择器可以确保其优先： CSS： #container > a:focus-visible { color: red !important; } 这确保了当锚点处于 :focus-visible 状态时，红色将覆盖 #container > a 中的黄色。

css css-selectors pseudo-class

回答 1 投票 0

如果所有子级都隐藏，则隐藏父级

我有一个包含组的列表，并使用 CSSOM 使用文本字段动态过滤内容。这是一种仅使用 CSS 来实现“搜索”的方法。不幸的是当过滤器过滤时

html css css-selectors

回答 2 投票 0

更改 Angular 中切换按钮的颜色

我无法更改 Angular 中切换按钮的颜色。这是我的代码：切换 ::ng-deep .custom-toggl...

sass angular-material css-selectors

回答 1 投票 0

如何选择页面中的最后一个元素？

有没有办法用CSS选择特定元素的最后一次出现？这是一个例子：DEMO 我尝试了最后一个孩子，但这不是我想要的。我用过这个类： HTML： ... 有没有办法用CSS选择特定元素的最后出现？这是一个例子：DEMO 我尝试过last-child但这不是我想要的。我用过这个课程： HTML： <ul> <li>test</li> <li> test test </li> </ul> <div> test test </div> test red CSS： span:last-child{ color:red; font-weight:bold; } 我希望最后一个带有“红色”内容的span是红色的。我怎样才能用CSS做到这一点？更新：对于具有相同父元素的元素，有一个使用 last-of-type 的解决方案。但不同的父母呢？试试这个：（你应该知道父包装元素） body > *:last-child > span:last-child{ color: red; } 工作小提琴这是从我的博客中获取的解决方案：https://css-tip.com/last-element-dom/ span { &:nth-last-child(1 of &):not(:has(~ * &) *):not(:has(~ &) *):not(:has(~ * &)):not(:has(&)) { color: red; font-weight: bold; } } <ul> <li>test</li> <li> test test </li> </ul> <div> test test </div> test red 一个更复杂的例子： span { &:nth-last-child(1 of &):not(:has(~ * &) *):not(:has(~ &) *):not(:has(~ * &)):not(:has(&)) { color: red; font-weight: bold; } } <div>Some content</div> <div> Some content Some content Some content Some content Some content Some content </div> <div> Some content Some content </div> Some content Some content <div> Some content Some content Some content Some content Some content Some content Some content Some content Some content Some content Some content Some content Some content Some content Some content Some content

css css-selectors

回答 2 投票 0

在 React 中不使用 CSS 模块可以实现作用域样式吗？

我的项目使用了CSS模块，但是输出的类名会添加hash后缀。这是不需要的，因为我想保持类名的语义。在 Vue.js 中，作用域样式可以通过

reactjs css-selectors

回答 1 投票 0

选择第一个出现的标签，但使用 CSS 忽略层次结构

我偶然发现了这个关于 CSS 选择器的问题。即选择第一次出现的但忽略其层次结构。我知道我可以使用 JavaScript 来 document.querySelectorAll('s...

css css-selectors

回答 1 投票 0

如何在CSS中的另一个规则中使用规则？

我觉得我的要求有点奇怪，但我也没有别的办法。有没有办法在现实生活中执行这个伪 css 规则：假设我有规则： .myCssRule1{ 颜色：红色； } 我不能（不要...