选择元素（optgroup）值未在 Safari 中显示 - CSS

【问题标题】：select element(optgroup) value is not displaying in safari - CSS选择元素（optgroup）值未在 Safari 中显示 - CSS
【发布时间】：2020-03-26 12:36:21
【问题描述】：

Css 内容属性不适用于 Safari 上的 Select 元素。但它完全适用于其他浏览器。

Check my fiddle across all browsers

在Chrome 和Safari 浏览器之间引用这些图片。

注意：它完全适用于除 Select 标签之外的其他元素。

【问题讨论】：

你能在浏览器之间分享图片以查看差异吗？
虽然现场演示的链接值得赞赏，但它并不能取代问题必须独立的规则，请：将您的“minimal reproducible example”代码添加到问题本身。
不幸的是，由于问题中缺少代码（如我之前的评论中所述），我投票关闭；但是，如果有人愿意关闭这个问题，这个问题也是“Pseudo elements and select tag”的副本（除非 OP 编辑解释这个问题如何有足够的不同，值得保持对新答案持开放态度）。
@Manjuboyz 我已附上图片

标签： html css safari

【解决方案1】：

当您将optgroup 用于firefox 和safari 时，这是一个问题，不幸的是，我们可以为select 尝试的选项非常少，所以这里是您可以使用的替代选项之一，在-如果这不是问题的话。

这对于所有浏览器都将保持不变。

span {
  display: inline-block;
  vertical-align: top;
}

select {
  height: 200px
}

span:before {
  content: attr(label);
}

.Header {
  font-weight: bold;
  color: black;
}

<select id="cars" multiple>
  <!-- you can use this as header -->
  <option class="Header" disabled>Swedish Cars</option>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <!-- you can use this as header -->
  <option class="Header" disabled>German Cars</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>
<span label='I am span content'></span>

【讨论】：