鍍金池/ 問(wèn)答/HTML5  網(wǎng)絡(luò)安全  HTML/ 大家?guī)兔聪挛疫@個(gè)hover選擇器出了什么問(wèn)題？

大家?guī)兔聪挛疫@個(gè)hover選擇器出了什么問(wèn)題？

<el-col :xs="24" :sm="24" class="introduce">
<el-col :xs="24" :sm="6" class="a">
            <div class="intro"><p>dadaaaaaaaaaaaaaaaaaaaaaaaaa</p><br>aaaaaaaaaaaaaaaaaaaaaa<br>aaaaaaaaaaaaaaaaaaaaaaa</div>
          </el-col>
</el-col>

CSS部分

  .introduce{
    position: absolute;
    top:930px;
    width:80%;
    left:50%;
    margin-left:-40%;
    background-color: white;
    box-shadow: 0 14px 30px rgba(0,0,0,0.1);
  }
  .intro{
    height: 400px;
    background-color: red;
    margin-top: 25px;
    margin-bottom:25px;
    border: 1px solid rgba(0,0,0,0.07);
    transition: all 0.2s;
    text-align: center;
  }
  .a  :hover {
    border-color:#74d7a5;
    box-shadow:4px 4px 0px #74d7a5 inset, -4px -4px 0px #74d7a5 inset
  }

沒(méi)有懸浮在p標(biāo)簽上時(shí)顯示的樣子

懸浮在p標(biāo)簽上的樣子

我只想有一圖片的效果，不想有二圖片的效果該如何修正？

回答
編輯回答
孤影
.intro:hover {
    border-color:#74d7a5;
    box-shadow:4px 4px 0px #74d7a5 inset, -4px -4px 0px #74d7a5 inset
}

.a:hover {
    border-left: 4px solid red;
    border-right: 4px solid red;  
}

其他樣式不變.

2017年11月27日 14:04