第09章 header元素

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
*{ margin:0; padding:0;}
body{ font-family:微软雅黑; text-align:center;}
a{ color:#f60; text-decoration:none;}
hgroup{ margin-bottom:10px;}
nav{ height:48px; background:#ff6600;}
nav li{ float:left; background:#000; border-radius:5px; padding:5px 10px; margin:10px; list-style:none;}
</style>
</head>
<body>
<header>
	<hgroup>
    	<h1>HTML5</h1>
        <a href="###">[手机版]</a>
        <a href="###">[电脑版]</a>
    </hgroup>
    <nav>
    	<ul>
        	<li><a href="###">首页</a></li>
            <li><a href="###">手机版</a></li>
            <li><a href="###">电脑版</a></li>
        </ul>
    </nav>
</header>
</body>
</html>

效果图:

 

猜你喜欢

转载自onestopweb.iteye.com/blog/2259912