标题 cta 在桌面上工作,当我切换到移动设备时没有任何反应
我尝试z-index
在 html 中增加数字而不是在样式表中
这是我有 CTA 的 html:CALL TO ACTION,它包含在三个跨度内:
.banner::after {
content: "";
display: block;
width: 100%;
height: 100%;
background-color: #333;
background-image: linear-gradient(to right, #0052d4, #4364f4), #6fb1fc;
position: absolute;
top: 12%;
left: 8;
opacity: .7;
z-index: 8;
}
@supports(mix-blend-mode: hand-light) {
.banner::after {
opacity: 1;
}
}
.banner>* {
z-index: 10;
position: relative;
}
<div class="hero-wrap js-fullheight">
<div class="container-fluid px-0 banner-z">
<div class="row d-md-flex no-gutters slider-text align-items-center js-fullheight justify-content-end banner banner-z">
<img class="one-third js-fullheight align-self-end order-md-last img-fluid" src="images/1.png" alt=" Get Your Business Online">
<div class="one-forth d-flex align-items-center ftco-animate js-fullheight">
<div class="text mt-5">
<span class="subheading"></span>
<h1 class="mb-3">
<span>LOVE,</span>
<span>CODE, </span>
<span>SLEEP</span>
</h1>
<p style="color: #f9d53e ;">
<b>offer affordable set of services to our clients.</b>
</p>
<p>
<a href="contact.html" class="btn btn-primary px-4 py-3">Get in touch</a>
</p>
</div>
</div>
</div>
</div>
</div>
添加z-index
为.hero-wrap .slider-text .one-forth
.hero-wrap .slider-text .one-forth{
z-index:9;
}
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句