background:rgba（r,g,b,opacity）

background:rgba（r,g,b,opacity）是设置为半透明的背景色，ie兼容性不是很好

一定程度上解决，节点里面的元素不透明，单单是背景色透明了

布局代码如下：

<div class="masked">
       <img src="images/intel.web.368.207.1.jpg" alt="" class="img-responsive">
       <div class="mask">
            <h5>解密2合1电脑</h5>
            <p>搭载英特尔处理器的2合1电脑，助你高效工作的同时带给你灵活可触控的平板体验。</p>
       </div>
</div>

样式设置如下：

        .masked {
            position: relative;
        }
        .masked .mask {
            position: absolute;
            top: 80%;
            bottom: 0;
            left: 0;
            right: 0;
            background: rgba(0,0,0,.5);
            transition: top .15s linear;
            color: #ffffff;
        }
        .masked .mask:hover {
            top: 0;
        }