先看下效果图

添加css代码：

    <style>
.one-one {
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    position: fixed;
    top: 0;
    z-index: 999;
    display: none;
  }
.one-hb {
width: 280px;
height: 368px;
position: fixed;
left: 50%;
top: 50%;
margin-top: -214px;
margin-left: -140px;
background: url("../images2/one.png") no-repeat;
background-size: 100%;
}
.chai {
left: 0;
text-align: center;
position: absolute;
bottom: 52px;
color: #914800;
width: 100%;
font-size: 18px;
font-weight: bold;
 }
.hb_close {
position: absolute;
bottom: -40px;
right: 50%;
margin-right: -15px;
width: 30px;
height: 30px;
background: url("http://cmspic.judacdn.com/tkjidicms/cms/images2/hb_close.png") no-repeat;
    background-size: auto;
background-size: cover;
 }
 </style>

html代码：

<div class="one-one" style="display: block;">
    <div class="one-hb" style="background:url('http://cmspic.judacdn.com/tkjidi/upload/images/1910/22/5daec7250a657.png')  no-repeat;background-size:cover">
        <a href="https://s.click.taobao.com/ze4Upxv" target="_blank"><span class="chai">立即领取</span></a>
        <div class="hb_close" onclick="$('.one-one').hide()"></div>

    </div>
</div>