我已经使用此CSS代码在单击搜索ID标签时显示了该元素。这是可能与jQuery的，但我只想用CSS做到这一点。请指教。
#open_search:active #search{
display: block;
transition: all 100ms ease-in-out;
}
html
<div class="row-fluid">
<div class="span2 language pull-right">
<div class="language-object">
</div>
</div>
<span id="open_search" class=" btn glyphicon glyphicon-search"></span>
<div id="search" class="span3 pull-left">
<span id="dnn_dnnSearch_ClassicSearch">
<span class="searchInputContainer" data-moreresults="مشاهده نتایج بیشتر" data-noresult="نتیجهای یافت نشد">
<input name="dnn$dnnSearch$txtSearch" maxlength="255" size="20" id="dnn_dnnSearch_txtSearch" class="NormalTextBox" autocomplete="off" placeholder="جستجو..." type="text">
<a class="dnnSearchBoxClearText"></a>
</span>
<a id="dnn_dnnSearch_cmdSearch" class="SearchButton pull-left" href="javascript:__doPostBack('dnn$dnnSearch$cmdSearch','')">Search</a>
</span>
<span id="close_search" class="btn glyphicon glyphicon-remove "></span>
</div>
<div id="login" class="span5 pull-left">
<div id="dnn_dnnLogin_loginGroup" class="registerGroup">
<a id="dnn_dnnLogin_enhancedLoginLink" title="ورود" class="LoginLink" rel="nofollow" onclick="this.disabled=true;" href="http://localhost/dnn_test/Login?returnurl=%2fdnn_test%2fskin2"> ورود </a>
</div>
<div id="dnn_dnnUser_registerGroup" class="registerGroup">
<ul class="buttonGroup">
<li class="userDisplayName list-inline">
<a id="dnn_dnnUser_enhancedRegisterLink" title="ثبتنام" rel="nofollow" href="http://localhost/dnn_test/Register?returnurl=http%3a%2f%2flocalhost%2fdnn_test%2fskin2"> ثبتنام</a>
</li>
</ul>
</div>
</div>
</div>
如果css无法实现，请通过jquery帮助完成。
CSS：
#search {
display: none;
transition: all 100ms ease-in-out;
}
#search.active {
display: block;
}
jQuery的：
$(function(){
$("#open_search").click(function(){
$("#search").toggleClass("active");
});
});
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句