在Bootstrap中有一个问题,不透明的div和按钮

时间:2016-02-12 06:11:23

标签: html css twitter-bootstrap

我正在尝试使用不透明度创建一个div并包含一个按钮。我无法弄清楚为什么按钮获得不透明度以及div。但文字很好。我希望按钮没有不透明度

CSS

.jumbotron {
  background-image: url('../images/parkbanner.jpg');
  background-size: cover;
  color: #000;
  padding: 150px 25px;
  font-family: Montserrat, sans-serif;
 }
 .container-fluid {
  padding: 60px 50px;
 }

.phone {
  margin: 5px;
  margin-left: 50px;
  background-color: #ffffff;
  opacity: 0.8;
  filter: alpha(opacity=60); /* For IE8 and earlier */
  border-radius: 25px;
  padding: 20px; 
  width: 300px;
  height: 175px; 
 }
.phone p{
  font-weight: bold;
  color: black;
}

HTML

<div class="jumbotron text-center">
<div class="row">
    <div class="col-md-4 text-center"></div>    
    <div class="col-md-4 col-center">
    <div class="phone">
        <p>Please Don't Wait Until<br /> It's Too Late </p>
            <button type="button" class="btn btn-success btn-lg">
                <span class="glyphicon glyphicon-earphone"></span>  1-888-496-8059
            </button>
        </div>  
        </div>
    <div class="col-md-4 text-center">

    </div>
</div>
</div>

[Opacity Button Issue[1]

3 个答案:

答案 0 :(得分:1)

.phone班级中移除opacity并添加rgba背景,然后您就可以了

background-color: rgba(255,255,255,.8);

答案 1 :(得分:0)

因为按钮包含在课堂电话中。尝试从该类中删除它或将opacity:0属性显式添加到按钮。

答案 2 :(得分:0)

更改按钮的不透明度。

mysqldump -uroot -proot_pass source_db | mysql -h remote_server_ip -uroot -proot_pass target_db