框阴影在Microsoft Edge中不起作用 [英] Box shadow not working in microsoft edge
本文介绍了框阴影在Microsoft Edge中不起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
Box-shadow在Microsoft Edge浏览器上不起作用.我已经在本节中实现了以下步骤:(我不是顶部的白痴)
Box-shadow not working on Microsoft Edge browser. I have implemented the follow in the section: (I'm not an idiot I have at the top)
<meta http-equiv="X-UA-Compatible" content="IE=edge">
这是我的index.html文件的正文:
This is the body of my index.html file:
<body>
<div id="wrapper">
<header>
<div id="header-inner">
<div id="logo">
<a href="index.html">body</a>
</div>
<ul>
<li><a href="index.html">Home</a></li>
<li><a id="sign-in" href="#">Sign in</a>
<span id="sign-in-menu">
<div class="arrow-up"></div>
<div class="arrow-up-top"></div>
<div class="form">
<form action="login.php" method="get">
<input type="text" placeholder="Username" name="inputUser">
<input type="password" placeholder="Password"
name="inputPass">
<!-- <input type="checkbox" name="checkbox" id="checkbox" class="css-checkbox">
<label for="checkboxG1" class="css-label">Remember me</label> COOOKKiiieeesss -->
</form>
</div>
<div class="submit-area">
<input type="submit" value="Sign up">
</div>
</span>
</li>
<li><a href="register.html">Sign up</a></li>
</ul>
</div>
</header>
</div>
悬停CSS框阴影代码:
The hover CSS box shadow code:
header li > span input[type=submit]:hover {
-webkit-box-shadow: 0 0 0 1px #383e46;
-ms-box-shadow: 0 0 0 1px #383e46;
box-shadow: 0 0 0 1px #383e46;
}
推荐答案
将CSS更改为:
header li > a > span input[type=submit]:hover {
-webkit-box-shadow: 0 0 0 1px #383e46;
-ms-box-shadow: 0 0 0 1px #383e46;
box-shadow: 0 0 0 1px #383e46;
}
或
header li span input[type=submit]:hover {
-webkit-box-shadow: 0 0 0 1px #383e46;
-ms-box-shadow: 0 0 0 1px #383e46;
box-shadow: 0 0 0 1px #383e46;
}
您已经在li
和span
之间放置了>
,但是span
永远不会直接出现在代码结构中的li
之后.相反,您需要像在我的第一个示例中那样在css中指定a
标记,或者像我在第二个示例中那样删除>
以除去特异性.
You have put an >
between the li
and span
however the span
never appears directly after the li
within the code structure. Instead you either need to specify the a
tag in your css like in my first example or remove the >
to remove the specificity like in my second example.
这篇关于框阴影在Microsoft Edge中不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文