<p>在下面的示例中，我有很多标签，其中标签包含输入。</p> <p><strong>有没有办法使CSS的不透明度样式应用于标签的innerText而不是任何子元素，而不需要显式指定颜色？在下面的示例中，不透明度已经应用于下拉菜单，而不仅仅是标签本身。</strong></p> <p>我知道我可以将标签元素更改为仅包围文本，然后添加一个<code>for=</code>，但我更喜欢将标签包裹在被标记的元素周围。</p> <pre class="brush:css;toolbar:false;">div{ padding: 10px;} select { background-color: white; } .colored{ color: white; background-color: lightblue; } label { opacity: .7; }</pre> <pre class="brush:html;toolbar:false;"> &lt;div class="colored"&gt; &lt;label&gt; My white label &lt;select&gt;&lt;option&gt;example that should be black-on-white&lt;/option&gt;&lt;/select&gt; &lt;/label&gt; &lt;/div&gt; &lt;div&gt; &lt;label&gt; My black label &lt;select&gt;&lt;option&gt;example that should be black-on-white&lt;/option&gt;&lt;/select&gt; &lt;/label&gt; &lt;/div&gt; &lt;div&gt; &lt;label for="select3"&gt;Good example&lt;/label&gt; &lt;select id="select3"&gt;&lt;option&gt;example that is indeed black-on-white&lt;/option&gt;&lt;/select&gt;&lt;/div&gt;</pre> <p><br /></p>

select {
  background-color: white;
}
.colored{
  color: white; 
  background-color: lightblue;
  padding: 10px;
}

label {
  color: rgba(255, 255, 255, .7);
}

<div class="colored">
   <label>
      我的标签
      <select><option>示例</option></select>
   </label>