Question

我对项目的css文件进行了很多修改，现在看来，除了标题中的所有按钮之外，所有其他按钮都是不可单击的。它们像文本一样显示。

我在Web开发方面还很先进，所以我找不到调试错误的方法。我希望这里的人可以看到我搞砸的地方：

在这里我进行了修改：

a.learn_more2{
        display:block;
        font-size:16px;
        color: #fff;
        background:#04042d;            
        height: 36px;
        line-height:26px;
        border-radius:3px;
        text-align:center;
        padding: 7px 7px;       
        text-transform:uppercase;
        font-weight: 600;
        transition:all 0.2s ease-in-out;
        -moz-transition:all 0.2s ease-in-out;
        -webkit-transition:all 0.2s ease-in-out;
        }
a.learn_more2:hover{
        background:#222222;
        }

这是代码的html部分：

<section id="top_content">
        <div class="top_cont_outer">
            <br>
            <br>
            <div class="top_cont_inner">
                        
            <div class="container">
                    <div class="row">
                                    <div class="module-inside">
                            
                            <div class="col-lg-7 col-sm-9">
                                
                                    <center>
                                        <br>
                                        <br>
                                        <br>
                                <h1 style="color: #04042d">
                                    {%  trans 'YOUR INVENTORY,' %}
                                    <p>{%  trans 'CONTROLED. BALANCED. OPTIMIZED.' %}</p>
                                </h1>
                                <hr style="height:2px;border-width:0;color:black;background-color:black">
                    <h3 style="color: #8a8d93">{%  trans 'QUANTITATIVE INVENTORY OPTIMIZATION SOLUTIONS' %}</h3>
                    <br>
                                <h3 style="color: #8a8d93">{%  trans 'Turn your operations data into intelligence.' %}</h3>

                                <h3 style="color: #8a8d93">{%  trans 'Reduce costs, inventory levels and shortages.' %}</h3>
                            <br>
                            <br>
            <div class="row">
                <a href="contact.html" class="learn_more2" style="margin:auto;display:block">{%  trans 'Try for free' %}</a>
                                            
                            <a href="features.html" class="learn_more2" style=" margin:auto;display:block">{%  trans 'Learn more' %}</a>
                    </div>
                       <br>
                            <br>
                            </center>
                                
                        </div>
                        </div>
                    <br>
                    <br>
                    <br>
</div>                                                          
</div>                      
</div>  
</div>

            
    </section>

更新：一个答案表明按钮可能被div标签遮盖了。本节中有两张图片，这是它的css代码：

.top_cont_outer {
  background: linear-gradient( rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) ), url(../img/exostock_background_banner.jpg);
  position: relative;
  background-repeat: no-repeat;
  background-size: cover;
  filter: engrave(100%);
  width: auto;
  padding-top: 60px
}

.top_cont_inner {
  background:linear-gradient( rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) ), url(../img/test_transparent-removebg.png);
  background-repeat: no-repeat;
  position: relative; 
  background-size: cover;
  filter: engrave(100%);
  width: auto;

更新2：确定的问题：

将标头设置为fixed导致了问题。但是，我希望将其修复，如何使它正常工作？


.header {
    display: table;
    z-index:1000;
    width: 100%;
    height: 100%;
    position: relative;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;

}

Answer 1

也许在按钮上方有一个具有透明背景的div

HTML + CSS：由于标题固定，因此无法单击按钮

1 个答案: