如何使用CSS属性选择器隐藏指定属性值的<br>元素？

你的初始代码本身是可行的，只要确保CSS能正确作用到目标<br>元素上。以下是几种可靠的实现方式及排查要点：

1. 直接属性选择器（最推荐） #

这是你最初的写法，只要没有更高优先级的CSS规则干扰，就能生效：

br[some-label="1"] {
  display: none;
}

注：尽量避免使用!important，除非确实存在无法通过选择器权重覆盖的样式冲突。如果必须保留，也可以正常使用，但优先通过优化选择器权重来控制样式优先级。

2. 结合父元素特征强化选择器 #

如果目标<br>所在的父元素（比如<p>）有可识别的位置或属性特征，可以通过加强选择器权重确保生效：

/* 选择页面中第二个<p>内带some-label="1"的br */
p:nth-of-type(2) br[some-label="1"] {
  display: none;
}

/* 如果父元素有自定义属性，可结合定位 */
p[data-custom] br[some-label="1"] {
  display: none;
}

3. 相邻兄弟选择器（针对有固定相邻元素的场景） #

如果目标<br>和特定元素相邻，可以用相邻兄弟选择器定位：

/* 选择紧跟在特定文本容器后的目标br（需文本被包裹在独立元素如span中） */
span:contains("Paragraph 2 with hidden") + br[some-label="1"] {
  display: none;
}

注意：:contains()选择器目前在部分浏览器中需开启实验性支持，纯CSS场景下有一定兼容性限制，优先推荐前两种方案。

失效排查要点 #

• 检查CSS是否正确加载，可通过浏览器开发者工具查看目标<br>的样式计算结果，确认是否被其他规则覆盖
• 确认some-label属性的拼写、大小写完全一致（HTML属性不区分大小写，但CSS属性选择器在部分文档环境下会区分，尽量保持统一）

内容的提问来源于stack exchange，提问作者Anil Menon