header元素

　　一般用来放置整个页面的标题，比如说一个新闻页面，header一般放新闻的标题，如果是一个官方网址，一般header用来放logo和网站导航。

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>header元素</title>

</head>

<body>

    <header>

        <h1>IT最新技术</h1>

        <a href="http:///www.baidu.com">百度</a>

        <nav>

            <ul>

                <li><a href="#">学习</a></li>

            </ul>

        </nav>

    </header>

</body>

</html>

footer元素

　  一般用来放置脚注，主要包含：作者信息、copyright。

address元素

　　一般用来呈现联系信息，主要包括：网站的联系方式，电子邮箱，地址

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>address元素</title>

</head>

<body>

    <address>

        <a href="#">iwen</a>

        <a href="#">ime</a>

    </address>

    <footer>

        <div>

            <address>

                <a href="#">ioj</a>

                地址：***

            </address>

            <time datetime="2019-03-11">2019-03-11</time>

        </div>

    </footer>

</body>

</html>

网页编排

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>网页编排</title>

</head>

<body>

    <header>

        <h1>网页标题</h1>

        <nav>

            <ul>

                <li><a href="#">首页</a></li>

            </ul>

        </nav>

    </header>

    <article>

        <h1>文章主标题</h1>

        <p>文章正文</p>

        <section>

            <div>

                <article>

                    <h1>评论标题</h1>

                    <p>评论正文</p>

                </article>

            </div>

        </section>

    </article>

    <footer>

        <small>版权所有：....</small>

    </footer>

</body>

</html>

九、非主体机构元素——header元素、footer元素、address元素、网页编排的更多相关文章

  1. html5-新布局元素header，footer

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

  2. html5 文档元素 header footer h1h2h4

    文档元素: 用于在页面的大布局, 区分各个主体和概念. 让整体清晰, 元素有语义, 进一步代替div 具体划分图示: (参考) <hgroup> <section> <n ...

  3. html5新特性-header,nav,footer,aside,article,section等各元素的详解

    Html5新增了27个元素,废弃了16个元素,根据现有的标准规范,把HTML5的元素按优先级定义为结构性属性.级块性元素.行内语义性元素和交互性元素四大类. 下面是对各标签的详解,section.he ...

  4. h5中的结构元素header、nav、article、aside、section、footer介绍

    结构元素不具有任何样式,只是使页面元素的的语义更加明确. header元素 header元素是一种具有引导和导航作用的的结构元素,该元素可以包含所有通常放在页面头部的内容.header元素通常用来放置 ...

  5. HTML（二）HTML元素（整体结构，块级元素，内联元素，结构元素，交互元素，元素嵌套规则）

    HTML整体结构解释 <!DOCTYPE html> // 文件应以"<!DOCTYPE ......>"首行顶格开始,推荐使用"<!DOC ...

  6. easy Html5 - Jquery Mobile之ToolBars(Header and Footer)

    jquery 在web js框架上的风暴还在继续却也随着移动终端走向了mobile:那么jquery mobile到底包括些什么呢 简介工具栏是在移动网站和应用中的头部,尾部或者内容中的工具条:Jqu ...

  7. Header 与 Footer 的 DIV 高度固定， 中间内容 DIV高度自适应，内容不满一页时，默认填满屏幕。

    一.需求: 页面布局分三大块: Header Body Footer 1.内容不满一页时,Footer 在屏幕最底部,Body 填充满 Header 与 Footer 中间的部分. 2.当缩小浏览器时 ...

  8. html5-hgroup和address元素

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

  9. Html中行内元素有哪些？块级元素有哪些？

    1.关于行内元素和块状元素的说明 根据CSS规范的规定,每一个网页元素都有一个display属性,用于确定该元素的类型,每一个元素都有默认的display属性值,比如div元素,它的默认display ...

随机推荐

  1. learning makefile .PHONY

  2. 网络编程，socket

    1.网络编程 网络: TCP/IP 彼此之间遵守协议和规范!之间才能产生通信! IP: 每个人都有自己的身份证号! 用来标识我们网络中每一台计算机! IP地址= 网络地址 +主机地址 网络地址 :标识 ...

  3. 阶段01Java基础day24多线程+GUI

    25.01_多线程(多线程方法) 1.yield让出cpu 2.setPriority()设置线程的优先级 25.02_多线程(单例设计模式)(掌握) 单例设计模式:保证类在内存中只有一个对象. 如何 ...

  4. 2019-04-16-day033-锁与队列

    内容回顾 几个问题 概念多,练习少 不问问题 概念?代码? Process类 并发并行 并发 是同一时间段内多个任务交替使用同一个cpu 并行 是在同一个时刻多个任务在不同的cpu上同时执行 同步异步 ...

  5. C++取反交换两个数的值

    int a = 1; int b = 2; cout << "a: "<< a << endl; cout << "b: ...

  6. Java连接数据库的driver和url写法

    oracle driver="oracle.jdbc.driver.OracleDriver" url="jdbc:oracle:thin:@localhost:1521 ...

  7. Gram格拉姆矩阵在风格迁移中的应用

    Gram定义 n维欧式空间中任意k个向量之间两两的内积所组成的矩阵,称为这k个向量的格拉姆矩阵(Gram matrix) 根据定义可以看到,每个Gram矩阵背后都有一组向量,Gram矩阵就是由这一组向 ...

  8. 【软件安装】nvidia驱动安装事宜

    https://docs.nvidia.com/cuda/cuda-toolkit-release-notes/index.html https://docs.nvidia.com/cuda/arch ...

  9. InstallShield-常用prq文件的下载地址

    VC 2010 redist X86: http://saturn.installshield.com/is/prerequisites/microsoft visual c++ 2010 redis ...

  10. ngnix 500错误原因分析

    参考http://www.cnblogs.com/huqiang/p/5333975.html