<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>新元素新布局模板</title>
    <style type="text/css">
        body{height: 608px}
        header{background: red;width: 100%;height: 10%}
        aside{width: 20%;height: 100%;float: left;background: #f0f0f0}
        section{width: 80%;height: 100%;float: left;background: #f8f8f8}
        footer{background: red;width: 100%;height: 10%;clear: left;}
        nav{width: 100%;height:50%;text-align: center;padding: 6px;}
        li{display: inline;}
        a{text-decoration: none;}
    </style>
</head>
<body>
    <header>
        <nav>
    <ul>
        <li><a href="">搜狐</a></li>
        <li><a href="">搜狐</a></li>
        <li><a href="">搜狐</a></li>
        <li><a href="">搜狐</a></li>
        <li><a href="">搜狐</a></li>
        <li><a href="">搜狐</a></li>
        <li><a href="">搜狐</a></li>
    </ul>
</nav>
    </header>
    <aside>
        <div id="div1">侧边</div>
    </aside>
    <section>
        <div id="div2">主体</div>
    </section>
<footer>底部</footer>
</body>
</html>

html5-新元素新布局模板的更多相关文章

  1. html5-新元素新布局模板-完善中

    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...

  2. 12款非常精致的免费 HTML5 & CSS3 网站模板

    01. Joefrey Mahusay 很炫的单页网站模板,基于 HTML5 & CSS3 制作,适合用于设计师个人简历.摄影师和平面设计师的个人作品展示. 演示  下载 02. Folder ...

  3. 16个时髦的扁平化设计的 HTML5 & CSS3 网站模板

    创建网站最好办法之一是使用现成的网站模板或使用开源 CMS 应用程序.所以,今天这篇文章给大家带来的是16款基于 HTML5 & CSS3 的精美的扁平风格网站模板,大家可以借助这些优秀的网站 ...

  4. 12款高质量的响应式 HTML5/CSS3 网站模板

    HTML5 已经成为众所周知的语言,大量的 HTML5 资源和工具正在建立,以帮助开发人员和设计人员.今天,我们展示12款免费的响应式 HTML5/CSS3 网站模板,帮助你创建醒目和视觉震撼的网站. ...

  5. *HTML5 新元素

    HTML5 新元素 自1999年以后HTML 4.01 已经改变了很多,今天,在HTML 4.01中的几个已经被废弃,这些元素在HTML5中已经被删除或重新定义. 为了更好地处理今天的互联网应用,HT ...

  6. HTML5 新元素、HTML5 Canvas

    HTML5 新元素 自1999年以后HTML 4.01 已经改变了很多,今天,在HTML 4.01中的几个已经被废弃,这些元素在HTML5中已经被删除或重新定义. 为了更好地处理今天的互联网应用,HT ...

  7. Html5学习2(Html表格、Html列表、Html5新元素、Canvas (坐标、路径、画圆、文本、渐变、图像))

    Html表格 1.表格中的表头:<th></th>.其中表头部分字体加粗,颜色深绿色 <h4>水平标题:</h4> <table border=& ...

  8. HTML5: HTML5 新元素

    ylbtech-HTML5: HTML5 新元素 1.返回顶部 1. HTML5 新元素 自1999年以后HTML 4.01 已经改变了很多,今天,在HTML 4.01中的几个已经被废弃,这些元素在H ...

  9. HTML5+CSS3学习笔记(二) 页面布局:HTML5新元素及其特性

    HTML5的语义化标签以及属性,可以让开发者非常方便地实现清晰的web页面布局,加上CSS3的效果渲染,快速建立丰富灵活的web页面显得非常简单. 本次学习HTML5的新标签元素有: <head ...

随机推荐

  1. javascript中的值如何传递到django下的views.py中或者数据库中?

    用Ajax,Ajax有很多种写法,包括JQuery和JS,这里贴一个用JQuery写的最通用的Ajax,POST方法传递JSON格式数据: $.ajax({ url: "your url&q ...

  2. 《linux 用户管理》- useradd/userdel/usermod/groupadd/who/w

    一:概念 在 Linux 中,使用一个 32位整数 来记录每一个用户(USER ID 简单 UID),这意味着在 Linux 中,可以有 40亿 个不同的用户. 系统. 在 /etc/passwd  ...

  3. Struts2验证框架_xml验证失败

    测试Struts2验证框架-->XML验证   启动tomcat后网页登录失败 Employee-validation.xml文件头如下: <!DOCTYPE validators PUB ...

  4. 对称加密----AES和DES加密、解密

    目前主流的加密方式有:(对称加密)AES.DES        (非对称加密)RSA.DSA 调用AES/DES加密算法包最精要的就是下面两句话: Cipher cipher = Cipher.get ...

  5. 洛谷P3250 网络 [HNOI2016] 整体二分

    正解:整体二分+树状数组 解题报告: 传送门! 亲这里的建议是用整体二分呢 dbq最近看sd淘宝说话体看多了有点脑抽,,, 首先考虑如果是单组询问怎么做昂QAQ 考虑二分答案 对于所有比mid小的操作 ...

  6. 那些年读过的书《Java并发编程的艺术》一、并发编程的挑战和并发机制的底层实现原理

    一.并发编程的挑战 1.上下文切换 (1)上下文切换的问题 在处理器上提供了强大的并行性就使得程序的并发成为了可能.处理器通过给不同的线程分配不同的时间片以实现线程执行的自动调度和切换,实现了程序并行 ...

  7. Advising controllers with the @ControllerAdvice annotation

    The @ControllerAdvice annotation is a component annotation allowing implementation classes to be aut ...

  8. LeetCode-860. Lemonade Change

    At a lemonade stand, each lemonade costs $5. Customers are standing in a queue to buy from you, and ...

  9. VS Code编辑器对git项目的支持

    使用git随便clone一个项目下来, 然后用vscode打开项目, 随便打开某个文件, 添加几行代码: 9-11行是我新添加的, 左边绿色的竖条(点击就会看到明细)就表示这几行是新添加的. 然后修改 ...

  10. linux 查看磁盘读写:iotop

    iotop命令用来动态地查看磁盘IO情况,用法如下: 安装iotop命令 [root@mysql ~]# yum install iotop -y [root@mysql ~]# iotop Tota ...