使用 html5shiv.js
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>兼容性处理</title>
<!--[if lt ie9]>
<script src="./html5shiv.js"></script>
<![endif]-->
<style>
header {
background-color: orange;
}
footer {
height: 100px;
line-height: 100px;
background-color: green;
text-align: center;
}
</style>
</head>
<body>
<!-- 头部 -->
<header>
<h1>xxx商城</h1>
</header>
<hr>
<!-- 主导航 -->
<nav>
<a href="#">首页</a>
<a href="#">订单</a>
<a href="#">购物车</a>
<a href="#">我的</a>
</nav>
<!-- 主要内容 -->
<div class="page-content">
<article>
<h2>感动中国人物</h2>
<section>
<h3>第一名：孙笑川</h3>
<p>男，籍贯四川，33岁</p>
</section>
<section>
<h3>第二名：药水哥</h3>
<p>真名刘波，男，籍贯湖北，30岁</p>
</section>
<section>
<h3>第三名：Giao哥</h3>
<p>男，籍贯河南，29岁</p>
</section>
</article>
<!-- 侧边栏导航 -->
<aside style="float: right;">
<nav>
<ul>
<li><a href="#">秒杀专区</a></li>
<li><a href="#">会员专区</a></li>
<li><a href="#">优惠券专区</a></li>
<li><a href="#">品牌专区</a></li>
</ul>
</nav>
</aside>
</div>
<hr>
<footer>
<nav>
<a href="#">友情链接1</a>
<a href="#">友情链接2</a>
<a href="#">友情链接3</a>
<a href="#">友情链接4</a>
</nav>
</footer>
</body>
</html>
评论 (0)