后台小案例

1019作业

header,顶部logo

<header>
      <h1>网站后台管理系统 <small>(v1.0)</small></h1>
      <section>
        <em>admin</em>
        <button onclick="location.href='logout.php'">退出</button>
      </section>
    </header>

nav,左侧导航菜单

 <nav>
      <a href="../1017/demo1.html" target="content">元素属性</a>
      <a href="../1017/demo2.html" target="content">布局元素</a>
      <a href="../1017/demo3.html" target="content">图文列表</a>
      <a href="../1017/demo4.html" target="content">图片链接与列表</a>
      <a href="../1017/demo7.html" target="content">细说表格</a>
      <a href="../1018/zuoye.html" target="content">表单元素与控件</a>
      <a href="demo1_1.html" target="content">音频与视频元素</a>
    </nav>

nav,后台右侧显示内容

 <iframe src="default.html" name="content"></iframe>

预览效果