首页 > 解决方案 > 如何通过其arrtibute(不是ID不是Class)在html元素中添加css

问题描述

我需要通过属性“data-email”来显示以上跨度。

<span contenteditable="false" id="signature1596021675154" tabindex="1" data-role="test" data-email="qwerty" title="qwerty" data-name="name" style="z-index: 600; margin-right: 0px; visibility: visible;" class="index signature-container editor-elements valid_button"> </span>

标签: javascripthtmljquery

解决方案


[attribute] 选择器用于选择具有指定属性的元素。

在你的CSS中你可以这样做:

span[data-mail] {
 display: none;
}

或者

span[data-mail="qwerty"] {
 display: none;
}

span[data-email]{
  color: red
}

span[data-email="test"]{
  color: blue
}
<span contenteditable="false" id="signature1596021675154" tabindex="1" data-role="test" data-email="qwerty" title="qwerty" data-name="name" style="z-index: 600; margin-right: 0px; visibility: visible;" class="index signature-container editor-elements valid_button">hello </span>

<span data-email="test">world</span>


推荐阅读