<style type="text/css">
div#foo {
    background: #0000ff;
    width: 200px;
    height: 200px;

    opacity: 0.30;
    filter: alpha(opacity = 30);
}
div#foo>div {
    color: black;
    opacity:1;
    filter: alpha(opacity = 100);
}
</style>

<div id="foo">
    <div>Lorem</div>
    <div>ipsum</div>
    <div>dolor</div>
</div>

No exemplo acima, a opacidade dediv#foo é herdado por elementos filho, fazendo com que o texto fique quase ilegível. Suponho que seja errado dizer que é herdado, a opacidade é aplicada à div pai e os filhos fazem parte disso, portanto, tentar substituí-lo pelos elementos filhos não funciona porque tecnicamente eles são opacos.

Normalmente, uso apenas uma imagem de plano de fundo png alfa nesses casos, mas hoje me pergunto se há uma maneira melhor de tornar um plano de fundo de uma div semitransparente sem afetar o conteúdo.