菜单不透明度使文本变为灰色

Question

也许你知道，我在我的网站上制作菜单....

现在，该菜单有opacity:0.7;，因此它背后的图像（背景图像）可见...就像Apple iMac上的菜单一样......现在......我已经把一些文字放到了菜单上......文字显然不是白色......看起来文字就在菜单后面......我试过z-index ......但没有变化......

有css：

.menu {
background-color: black;
opacity:.7;
right: -400px;
height: 100%;
position: fixed;
width: 400px;
z-index:-10;
}

h1 {
z-index:10;
color:white;
font-size: 50px;
padding: 0;
margin: 0;
font-family:Segoe UI Light;
margin-left: 20px;
}

有人知道如何解决这个问题吗？请帮帮我