<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>head</title>

</head>

<body>

<header>

    <h1>网页标题</h1>

</header>

<article>

    <header>

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

    </header>

    <p>文章的内容</p>

</article>

</body>

</html>

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <style>

        *{

            margin:0;

            padding:0;

        }

        body{

            font-family:微软雅黑；

            text-align:center;

        }

        a{

            color:orange;

            text-decoration: none;

        }

        hgroup{

            margin-bottom: 10px;;

        }

        nav{

            background: orange;

            height:48px;

        }

        nav li{

            float:left;

            background-color: #000000;

            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>

header元素的更多相关文章

  1. 九、非主体机构元素——header元素、footer元素、address元素、网页编排

    header元素 一般用来放置整个页面的标题,比如说一个新闻页面,header一般放新闻的标题,如果是一个官方网址,一般header用来放logo和网站导航. <!DOCTYPE html> ...

  2. header元素 footer元素 hgroup元素

    header元素 header元素是一种具有引航和导航作用的结构元素, 通常用来放置整个页面或页面内的一个内容区块的标题, 但是也可以包含其他内容, 例如数据表格,搜索表单, 或相关的logo图片 h ...

  3. HTML5<header>元素

    HTML5<header>元素 1.header元素描述了文档的头部区域,主要用于定义内容的介绍展示区域. 2.实例: <header> <h2>heder元素描述 ...

  4. HTML5新增的非主体元素header元素、footer元素、hgroup元素、adress元素

    ---恢复内容开始--- header header元素是一种具有引导和导航作用的结构元素,通常用来放置整个页面或页面内的一个内容区块的标题,但是也可以包含其他内容,例如数据表格.搜索表单或相关的lo ...

  5. html5--2.1新的布局元素(1)-header/footer

    html5--2.1新的布局元素(1)-header/footer 学习要点 了解header/footer的语义和用法 使用header/footer进行一个简单的布局 header元素(标签) 用 ...

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

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

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

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

  8. 读书笔记：《HTML5开发手册》--HTML5新的结构元素

    读书笔记:<HTML5开发手册> (HTML5 Developer's CookBook) 虽然从事前端开发已有很长一段时间,对HTML5标签也有使用,但在语义化上面理解还不够清晰.之前在 ...

  9. HTML5结构元素

    前面的话 几年前,用于网页布局的一般都用div元素,但语义化并不好.HTML5引入了大量新的块级元素来帮助提升网页的语义,使页面具有逻辑性的结构.容易维护,并且对数据挖掘服务更加友好.本文将详细介绍H ...

随机推荐

  1. 【2016-08-18】转载：总结C++中几种结构体初始化的方法

    作者:Ac_Von 博客地址:http://www.cnblogs.com/vongang/ 文章地址:http://www.cnblogs.com/vongang/archive/2011/07/3 ...

  2. cuda 初学大全

    转自:http://blog.csdn.net/augusdi/article/details/12529331 cuda 初学大全 1 硬件架构CUDA编程中,习惯称CPU为Host,GPU为Dev ...

  3. 解决win10装不了wifi驱动

    右击,选择更新程序驱动软件 ok  好了

  4. Xn数列（codevs 1281）

    题目描述 Description 给你6个数,m, a, c, x0, n, g Xn+1 = ( aXn + c ) mod m,求Xn m, a, c, x0, n, g<=10^18 输入 ...

  5. ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室（九） 之 用 Redis 实现用户在线离线状态消息处理（一）

    前言 上一篇中简单讲解了用Redis缓存在线用户逻辑.篇幅也比较小,本篇将详细实现用户的上线下线通知.图片效果转换功能.而且,代码和开发思路都会详细介绍. 效果展示 目前有三个用户,user1,use ...

  6. microsofr visual studio编写c语言

    过程: 1.创建win32 控制台项目 文件->新建->项目->Visual C++ ->Win32   输入项目名称   选择项目保存位置 2.添加->新建如图

  7. Spring 注释 @Autowired 和@Resource

    一. @Autowired和@Resource都可以用来装配bean,都可以写在字段上,或者方法上. 二. @Autowired属于Spring的:@Resource为JSR-250标准的注释,属于J ...

  8. DDR3详解（以Micron MT41J128M8 1Gb DDR3 SDRAM为例）

    转自:http://www.360doc.com/content/14/0116/16/15528092_345730642.shtml 以及参考网络. 首先,我们先了解一下内存的大体结构工作流程,这 ...

  9. jcaptcha组件小小改造解决Invalid ID, could not validate une

    https://my.oschina.net/chainlong/blog/192014

  10. 安装oracle 10g RAC执行的几个脚本说明

    1,/u01/app/oracle/oraInventory/orainstRoot.sh 脚本 #!/bin/sh if [ -d "/etc" ]; then /etc; fi ...