CSS内容属性不适用于野生动物园中的select元素

Question

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

Check my fiddle across all browsers

---

在Chrome和Safari浏览器之间查阅这些图像。

---

注意：它与Select标记之外的其他元素完全匹配。

Answer 1

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 Car</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>