支持IE8的纯css3开发的响应式设计动画菜单教程

作者：佚名字体：[增加减小] 来源：互联网时间：2017-06-02

本文主要包含ie8支持css3,让ie8支持css3,如何让ie8支持css3,ie8不支持css3,怎么让ie8支持css3等相关知识,佚名希望在学习及工作中可以帮助到您

　　这是一个响应式设计的菜单。单击列表图标，当你显示屏大小可以完全水平放下所有菜单项时，菜单水平显示（如图1）。当你的显示屏不能水平放置所有菜单项时，菜单垂直显示（如图2）。而且显示的时候是以动画的型式显示。效果相当的好。

图1

图2

　　下面是实现的代码。

　　html代码：

</div>

<div class="container">
<!--[if lte IE 8]>
<style>
.iconicmenu > label{
border-width: 7px;
background: #eee;
}
.iconicmenu:hover ul{
left: 8px; /* show menu onmouseover in IE8 and below */
}
</style>
<![endif]-->
<div class="iconicmenu">
<input type="checkbox" id="togglebox" />
<ul>
<li><a targe="_blank" href="http://www.weikejianghu.com/Shili/css3%E8%8F%9C%E5%8D%95">Home</a></li>
<li><a targe="_blank" href="http://www.weikejianghu.com/Shili/css3%E8%8F%9C%E5%8D%95">DHTML</a></li>
<li><a targe="_blank" href="http://www.weikejianghu.com/Shili/css3%E8%8F%9C%E5%8D%95">CSS Library</a></li>
<li><a targe="_blank" href="http://www.weikejianghu.com/Shili/css3%E8%8F%9C%E5%8D%95">CSS Gallery</a></li>
<li><a targe="_blank" href="http://www.weikejianghu.com/Shili/css3%E8%8F%9C%E5%8D%95">JavaScript</a></li>

相关文章