css-selectors 相关问题

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

获取选择器的文本，放入if语句

我正在尝试获取此选择器的文本（搜索结果中视频的上传日期）： #metadata-line > span:nth-child(4) 文本是这样的：“x 前上传”。 tha 中的 x

javascript node.js css-selectors jquery-selectors selector

回答 0 投票 0

使用 css 选择器从底部获取元素计数

我正在使用 testcafe 创建自动化测试脚本，但遇到了问题。我选择使用 nth(-1) 来获取最后一个元素。但是我们如何从最后一个元素开始计算 prevSibling 元素呢？

css automation css-selectors ui-automation testcafe

回答 0 投票 0

有没有办法选择不在任何 html 标签内的元素？？的

我在一个项目中使用dangerouslydangerouslySetInnerHTML来获取html并显示它。示例代码：这里有一些文字 1 这里有一些文字 2 这里有一些文字 3 <

html css next.js css-selectors dangerouslysetinnerhtml

回答 0 投票 0

如何让 ::before 出现在 div 的每一行之前？

我有一个 div 元素，它在 ::before 上有一个 border-left。它在一行上完美运行，但是当我换行时，左边框只覆盖第一行。我怎样才能把那条线传播到恩...

html css css-selectors

回答 2 投票 0

如何使用 Selenium webdriver 访问 <li> 项目

我想访问网页中的项。从给定的 HTML 中，我如何访问列表项，例如用户、品牌和型号？？我无法检索列表的内容。我的代码是... 我想访问网页中的<li>项目。从给定的 HTML 中，我如何访问用户、品牌和型号等列表项？？我无法检索列表的内容。我的代码没有执行在 for 循环中添加的代码。 HTML： <li class="nav-item">   Add <ul class="add-menu collapse" id="add"> <li>User</li> <li>Make</li> <li>Model</li> </ul> </li> 要匹配单个项目，您可以使用以下 XPath 定位器： //li/span[text()='User'] 要匹配所有项目并获取其文本，相关的 XPath 表达式将是： //ul[@class='add-menu collapse']/li/span 示例Python代码： for li in driver.find_elements_by_xpath("//ul[@class='add-menu collapse']/li/span"): print(li.text) 要打印 User、Make & Model 等列表项，您可以使用以下解决方案： Java：使用cssSelector： List<String> myItems = new WebDriverWait(driver, 20).until(ExpectedConditions.visibilityOfElementLocated(By.cssSelector("li.nav-item ul.add-menu.collapse li>span"))).stream().map(element->element.getAttribute("innerHTML")).collect(Collectors.toList()); System.out.println(myItems); 使用xpath： List<String> myItems = new WebDriverWait(driver, 20).until(ExpectedConditions.visibilityOfAllElementsLocatedBy(By.xpath("//li[@class='nav-item']//ul[@class='add-menu collapse']//li/span"))).stream().map(element->element.getAttribute("innerHTML")).collect(Collectors.toList()); System.out.println(myItems); Python：使用CSS_SELECTOR： print([my_elem.get_attribute("innerHTML") for my_elem in WebDriverWait(driver, 5).until(EC.visibility_of_all_elements_located((By.CSS_SELECTOR, "li.nav-item ul.add-menu.collapse li>span")))]) 使用XPATH： print([my_elem.get_attribute("innerHTML") for my_elem in WebDriverWait(driver, 5).until(EC.visibility_of_all_elements_located((By.XPATH, "//li[@class='nav-item']//ul[@class='add-menu collapse']//li/span")))]) 注意：您必须添加以下导入： from selenium.webdriver.support.ui import WebDriverWait from selenium.webdriver.common.by import By from selenium.webdriver.support import expected_conditions as EC

javascript selenium-webdriver xpath css-selectors xpath-1.0

回答 2 投票 0

为什么我无法从 daraz 中提取书名

我尝试在 scrapy shell 中从 Daraz 抓取书籍，但我没有得到任何东西。链接：达拉兹这是我得到的结果：在 [90] 中：response.css('#root > div > div.ant-row.c10-Cg > div:nth-chil...

python web-scraping scrapy css-selectors

回答 2 投票 0

多个CSS伪类的行为[重复]

我正在尝试设计一个 CSS 选择器，它将选择没有特定类的父容器中的最后一个兄弟。在这个例子中，我想要标记为“Two”的按钮...

html css css-selectors pseudo-class

回答 0 投票 0

如何获取 Shadow-root 中元素的 cssSelector 路径

能否请你帮我找到元素两厢的正确路径这是我使用的 java 代码，显然 cssSelector 路径是错误的 WebElement shadowHost2 = driver.findElement(By.xpath...

java selenium-webdriver css-selectors

回答 1 投票 0

使用 selenium、python 访问元素的问题

我试图访问的元素是一个下拉菜单，弹出窗口，对此我不确定。应该发生的是我在输入字段中输入一个 ID 然后需要几秒钟来加载和搜索...

python-3.x selenium-webdriver drop-down-menu css-selectors

回答 1 投票 0

Automatically copy text from element to :before content 属性

我正在尝试在不创建额外的文本元素的情况下在我的页眉上添加缩放文本效果。尝试这样做，我正在使用 ::before 伪元素。然而，为了创造这种效果，伪元素......

jquery css-selectors pseudo-element

回答 1 投票 0

如何在特定 id 的选择器之后更改 css

我正在尝试更改代码，以便当我将鼠标悬停在#btnSaveChanges 上时，它将以蓝色而不是黑色的背景颜色更改。与#btnLogout 类似。 HTML 我正在尝试更改代码，以便当我将鼠标悬停在#btnSaveChanges 上时，它将以蓝色而不是黑色的背景颜色进行更改。与#btnLogout 类似。 HTML <button id="btnSaveChanges" className="button-57" onClick={handleSave}> Save Save </button> <button id='btnLogout' className="button-57" onClick={handleLogout}> Logout Logout </button> CSS： .button-57 { position : relative; overflow : hidden; border : 1px solid #BBBBBB; border-radius : 20px; color : #18181a; display : inline-block; font-size : 15px; line-height : 15px; padding : 18px 18px 17px; text-decoration : none; cursor : pointer; background : #fff; user-select : none; -webkit-user-select : none; touch-action : manipulation; width : 45%; margin :10px; } .button-57 span:first-child { position : relative; transition : color 600ms cubic-bezier(0.48, 0, 0.12, 1); z-index : 10; } .button-57 span:last-child { color : white; display : block; position : absolute; bottom : 0; transition : all 500ms cubic-bezier(0.48, 0, 0.12, 1); z-index : 100; opacity : 0; top : 50%; left : 50%; transform : translateY(225%) translateX(-50%); height : 14px; line-height : 13px; } .button-57:after{ content : ""; position : absolute; bottom : -50%; left : 0; width : 100%; height : 100%; background-color : black; transform-origin : bottom center; transition : transform 600ms cubic-bezier(0.48, 0, 0.12, 1); transform : skewY(9.3deg) scaleY(0); z-index : 50; } .button-57:hover:after, .button-57:active:after { transform-origin : bottom center; transform : skewY(9.3deg) scaleY(2); } .button-57:hover span:last-child, .button-57:active span:last-child { transform : translateX(-50%) translateY(-50%); opacity : 1; transition : all 900ms cubic-bezier(0.48, 0, 0.12, 1); } 因此我尝试添加这些类，但是没有用，而是动画没有触发。 .button-57#btnSaveChanges::after{ content : ""; position : absolute; bottom : -50%; left : 0; width : 100%; height : 100%; background-color : #2140D9; transform-origin : bottom center; transition : transform 600ms cubic-bezier(0.48, 0, 0.12, 1); transform : skewY(9.3deg) scaleY(0); z-index : 50; } .button-57#btnLogout:after{ content : ""; position : absolute; bottom : -50%; left : 0; width : 100%; height : 100%; background-color : #db2020; transform-origin : bottom center; transition : transform 600ms cubic-bezier(0.48, 0, 0.12, 1); transform : skewY(9.3deg) scaleY(0); z-index : 50; } 动画没有触发我做错了什么？有没有办法实现这个。将!important规则添加到transform上.button-57:hover:after. .button-57 { position: relative; overflow: hidden; border: 1px solid #BBBBBB; border-radius: 20px; color: #18181a; display: inline-block; font-size: 15px; line-height: 15px; padding: 18px 18px 17px; text-decoration: none; cursor: pointer; background: #fff; user-select: none; -webkit-user-select: none; touch-action: manipulation; width: 45%; margin: 10px; } .button-57 span:first-child { position: relative; transition: color 600ms cubic-bezier(0.48, 0, 0.12, 1); z-index: 10; } .button-57 span:last-child { color: white; display: block; position: absolute; bottom: 0; transition: all 500ms cubic-bezier(0.48, 0, 0.12, 1); z-index: 100; opacity: 0; top: 50%; left: 50%; transform: translateY(225%) translateX(-50%); height: 14px; line-height: 13px; } .button-57:after { content: ""; position: absolute; bottom: -50%; left: 0; width: 100%; height: 100%; background-color: black; transform-origin: bottom center; transition: transform 600ms cubic-bezier(0.48, 0, 0.12, 1); transform: skewY(9.3deg) scaleY(0); z-index: 50; } .button-57:hover span:last-child, .button-57:active span:last-child { transform: translateX(-50%) translateY(-50%); opacity: 1; transition: all 900ms cubic-bezier(0.48, 0, 0.12, 1); } .button-57#btnSaveChanges::after { content: ""; position: absolute; bottom: -50%; left: 0; width: 100%; height: 100%; background-color: #2140D9; transform-origin: bottom center; transition: transform 600ms cubic-bezier(0.48, 0, 0.12, 1); transform: skewY(9.3deg) scaleY(0); z-index: 50; } .button-57#btnLogout:after { content: ""; position: absolute; bottom: -50%; left: 0; width: 100%; height: 100%; background-color: #db2020; transform-origin: bottom center; transition: transform 600ms cubic-bezier(0.48, 0, 0.12, 1); transform: skewY(9.3deg) scaleY(0); z-index: 50; } .button-57:hover:after, .button-57:active:after { transform-origin: bottom center; transform: skewY(9.3deg) scaleY(2) !important; } <button id="btnSaveChanges" class="button-57" onClick={handleSave}>SaveSave</button> <button id='btnLogout' class="button-57" onClick={handleLogout}>LogoutLogout</button>

html css user-interface css-selectors css-animations

回答 1 投票 0

为什么文本框不等于图像大小？

定义我如何解决文本框等于图像的问题。它是如何解决的。我将它 div 到 dov 图像，如导航栏下拉菜单。你可以看到这里的一切。我试图解决它但是在...

html css forms css-selectors

回答 1 投票 0

如何定位 CSS 网格布局中的特定列或行？

是否可以使用 CSS 选择特定的网格列或行？例如，假设我有一个 3 行 2 列的 CSS 网格布局：grid-template-rows: 1fr 1fr 1fr;网格模板列：1fr 1fr；。怎么...

html css css-selectors css-grid

回答 7 投票 0

如何把亚马逊的图书信息做成表格形式？

我有一个亚马逊链接，即我可以使用 soup.select("#detailBullets_feature_div .a-unordered-list:first-child") 从 HTML 中提取产品详细信息，即我有一个亚马逊链接，即我可以使用 Product details 从 HTML 中提取 soup.select("#detailBullets_feature_div .a-unordered-list:first-child")，即， <ul class="a-unordered-list a-nostyle a-vertical a-spacing-none detail-bullet-list"> <li> Publisher : Matrix Editions (January 1, 2007) </li> <li> Language : English </li> <li> Hardcover : 640 pages </li> <li> ISBN-10 : 0971576610 </li> <li> ISBN-13 : 978-0971576612 </li> <li> Item Weight : 2.3 pounds </li> </ul> 你能解释一下如何将以上数据以表格形式呈现吗？我的预期结果是 from bs4 import BeautifulSoup import pandas as pd from selenium import webdriver from selenium.webdriver.chrome.service import Service from webdriver_manager.chrome import ChromeDriverManager link = 'https://www.amazon.com/Functional-Analysis-Dzung-Ha/dp/0971576610' driver = webdriver.Chrome(service = Service(ChromeDriverManager().install())) driver.get(link) soup = BeautifulSoup(driver.page_source, 'html.parser') soup.select("#detailBullets_feature_div .a-unordered-list:first-child")

html css python-3.x beautifulsoup css-selectors

回答 0 投票 0

scss：第n个孩子不会为轮换卡工作

我现在不知道我做错了什么？每张卡的旋转必须不同。但是 :nth-child() 不起作用？任何人都知道我做错了什么？每个（卡）走 -11.21deg ... 我试过 &:...

html sass css-selectors rotation

回答 1 投票 0

我正在尝试在我的网站上制作双色调的所有图像，而不必使用伪元素和包装器。（试图保持 HTML 干净）

目前，我一直在使用这个教程。但它并不像我希望的那样干净，而且我相信有更好的选择。我知道我可以这样做： .img-wrap{ 位置：相对； } ....

javascript html css sass css-selectors

回答 2 投票 0

为什么媒体查询根本不起作用？

基本上无论我尝试使用媒体查询、最大/最小宽度、屏幕/所有，无论我编辑页脚背景或任何其他背景或颜色或显示非，它都不起作用！我确实添加了元视口...