能否在CSS中使用data-id属性实现精准元素隐藏？

问题分析 #

你之前尝试用data-id属性选择元素时写法错误，导致CSS规则不生效。错误点在于：

• 错误使用后代选择器（空格），但#text_2和data-id属于同一个元素，并非父子层级关系
• 属性选择器语法错误，不能用#data-id格式，正确的属性选择器写法是[data-id="属性值"]

正确CSS写法 #

如果#text_2元素本身带有data-id="118233376"属性，使用以下规则即可仅隐藏目标元素：

@media (max-width: 767px) {
  .col.align.left {
    visibility: hidden;
    display: none;
  }
  #text_2[data-id="118233376"] {
    visibility: hidden;
    display: none;
  }
}

如果data-id="118233376"是#text_2的子元素，调整为后代选择器格式：

@media (max-width: 767px) {
  .col.align.left {
    visibility: hidden;
    display: none;
  }
  #text_2 [data-id="118233376"] {
    visibility: hidden;
    display: none;
  }
}

额外注意事项 #

• 若平台自带CSS优先级较高，可在属性值后添加!important强制生效（仅必要时使用）：

  #text_2[data-id="118233376"] {
    visibility: hidden !important;
    display: none !important;
  }
  

• 确认data-id属性值完全匹配（注意数字、大小写是否正确），避免拼写错误导致规则失效

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