html - 为什么我不能为文本设置透明颜色

Question

我有照片，在她的跨度上。

我的 span 背景颜色为白色，我想将文本设置为透明。

像这样: http://justdrop.me/b26e25bf4544a68a4e7b76c73169a4d1.PNG

我试过:

Background-color:white;
color:transparent;

但不工作。

HTML:

<div class="col-md-12 picturebee no-padding">
        <img class="beepic" src="img/img7.jpg" alt="Picture bee">
        <span class="text">Lorem ipsum dolor!</span>
    </div>

CSS

.picturebee{
    margin-top:50px;
    position: relative;
}
.picturebee span{
position: absolute;
top:30px;
font-size:53px;
color:white;
font-family: 'Cuprum', sans-serif;
       left: 35%;
  transform: translateX(-26%);
  text-shadow: 1.4px 1.4px #222;

}

Answer 1

试试这个 CSS:

.picturebee{
    margin-top:50px;
    position: relative;
}
.picturebee span{
position: absolute;
top:30px;
font-size:53px;
background-color:white;
font-family: 'Cuprum', sans-serif;
       left: 35%;
  transform: translateX(-26%);
  text-shadow: 1.4px 1.4px #222;

}
.text{opacity: 0.5;}