html - 包含部分匹配的 CSS 目标属性

标签 html css match selector partial

使用以下 CSS,为什么我无法定位后面的 3 个 anchor 标记?

a[href~="checkout"] { /* Do something. */ }

<a href="http://shop.mydomain.com/checkout/onepage/">
<a href="https://shop.mydomain.com/checkout/onepage/">
<a href="https://shop.mydomain.com/checkout/onepage/?___SID=S">

我的 CSS 选择器做错了什么?我正在尝试使用 ~= 为所有包含单词“checkout”的 URL 选择部分匹配。

最佳答案

试试这个

a[href*="checkout"] { /* Do something. */ }

您必须使用 *,这意味着包含 - 参见reference .

另外,不要忘记关闭 anchor 标签

</a>

工作 JSFiddle

关于html - 包含部分匹配的 CSS 目标属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30473834/

相关文章:

javascript - fpdf/php 文本区域没有通过行尾

javascript - html下拉问题

python - 正则表达式匹配不适用于 Pyteomics 解析器的简单字符串

javascript - 使用匹配在字符串中查找 ID

regex - Awk match() - 每行多个

java - 在未包含在标签中的多行文本节点中用 <br> 标签替换换行符

css - 如何将嵌套在另一个面板内的 Bootstrap 面板内的图像居中?

javascript - 如何在 webGL 和 HTML5 中移动整个场景?

html - div 将内容与其他 div 对齐

javascript - 无法使用 jQuery 更改背景位置