title: Set opacity to the menu but keep text opaque in CSS
body: <p>How can I create a menu which only its background is transparent? The text should keep opaque (opacity: 1)</p>
  
  <p>If I set</p>
  
  <pre><code>li:hover {
      opacity: 0.5
  }
  </code></pre>
  
  <p>The whole list item becomes transparent. How do I fix that?</p>