z-index 在移动设备上适用于标题 cta 文本,但适用于桌面?

新约翰内斯堡

标题 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] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

z-index 不适用于背景视频上的文本

来自分类Dev

z-index不适用于嵌套的绝对元素

来自分类Dev

HTML Onclick不适用于负z-index

来自分类Dev

Z-index不适用于伪元素:: before

来自分类Dev

Z-index不适用于伪元素:: after

来自分类Dev

z-index不适用于绝对元素

来自分类Dev

z-index不适用于固定位置

来自分类Dev

z-index不适用于嵌套的绝对元素

来自分类Dev

Z-Index 不适用于表格元素

来自分类Dev

为什么z-index仅适用于定位的元素?

来自分类Dev

CSS-Z-index不适用于相对和绝对位置

来自分类Dev

HTML-CSS:z-index不适用于相对位置

来自分类Dev

z-index不适用于样式化组件中的模糊效果

来自分类Dev

Z-index不适用于dropotron-meu和bx-slider

来自分类Dev

为什么z-index不适用于具有绝对位置的div元素

来自分类Dev

HTML-CSS:z-index不适用于相对位置

来自分类Dev

z-index 不适用于自定义嵌套工具提示

来自分类Dev

z-index 不适用于相对父元素和之后/之前元素

来自分类Dev

锚链接适用于桌面但不适用于移动设备

来自分类Dev

单击时的 jQuery 类适用于桌面,但不适用于移动设备

来自分类Dev

动态标题仅适用于 index.html

来自分类Dev

z索引不适用于<input>

来自分类Dev

仅适用于移动设备的轮播

来自分类Dev

LocalStorage 不适用于移动设备?

来自分类Dev

Ajax 不适用于移动设备

来自分类Dev

桌面上的 bootstrap 文本大小非常小,适用于较小的屏幕尺寸和移动设备

来自分类Dev

ASP.NET MVC - 路由适用于 /home 但不适用于 /home/index

来自分类Dev

z索引不适用于图片和p标签

来自分类Dev

z索引不适用于固定元素