我在网上阅读过关于精灵和 IE8 的一百万个问题,但是,它们似乎都处理了精灵根本没有出现的问题。我的出现了,它只是显示了错误的精灵。它在所有其他浏览器中都能正常工作。
这是CSS
div.searchForm input[type=text] {
border: 0;
padding: 0 10px;
margin: 0;
background: url(../img/sprite.png) 0 -125px no-repeat;
background-size: 115% 235px;
width: 600px;
height: 30px;
float: left;
font-size: 12px;
color: #fff;
-webkit-appearance: none;
-webkit-border-radius: 0;
}
和html:
<section id="secondary6">
<h1 class="hidden">Search</h1>
<div class="clearfix">
<div class="grid_4">
<nav class="grid_2 secondary">
<h1 class="hidden">Search Secondary Navigation</h1>
</nav>
<div class="searchForm">
<input type="text" placeholder="search">
<input type="button">
<input type="submit" class="hidden" >
</div>
</div>
</div>
</section>
基本上你点击搜索按钮,它会显示一个应该隐藏的搜索栏。就像我说的它适用于其他浏览器。