如何使CSS按钮显示透明

Question

我有下面的CSS,它创建一个按钮,但我希​​望有透明效果(并略微看到后面的背景).请注意,我不希望它完全透明,完全不可见.只是一点点......

我曾尝试弄乱"不透明度",但这只会模糊图像并扭曲颜色.

.i2Style {
  font:bold 20px"Arial Black", Gadget, sans-serif;
  font-style:normal;
  color:#ffd324;
  background:#158edb;
  border:0px solid #4a3a00;
  text-shadow:0px -1px 1px #222222;
  box-shadow:0px 0px 12px #2e2300;
  -moz-box-shadow:0px 0px 12px #2e2300;
  -webkit-box-shadow:0px 0px 12px #2e2300;
  border-radius:15px 15px 15px 15px;
  -moz-border-radius:15px 15px 15px 15px;
  -webkit-border-radius:15px 15px 15px 15px;
  width:87px;
  padding:20px 46px;
  cursor:pointer;
  margin:0 auto;
}

.i2Style:active {
  cursor:pointer;
  position:relative;
  top:2px;
}

Answer 1

透明度由alpha通道决定.

例如,

.button{
  background-color: rgba(0,0,0,1); // red, green, blue, alpha
}

给出一个完整的黑色按钮,

.button{
  background-color: rgba(0,0,0,0.5); // red, green, blue, alpha
}

黑色按钮,透明度为50%.