1-3、nav元素

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>nav</title>
</head>
<body>
    <h1>技术资料</h1>
    <nav>
        <ul>
            <li><a href="#">主页</a></li>
            <li><a href="#">开发文档</a></li>
        </ul>
    </nav>
    <article>
        <header>
            <h1>HTMl5与CSS3的历史</h1>
            <nav>
                <ul>
                    <li><a href="#">HTML5的历史</a></li>
                    <li><a href="#">CSS3的历史</a></li>
                </ul>
            </nav>
        </header>
        <section id="html5">
            <h1>HTML5的历史</h1>
            <p>HTML5的历史正文</p>
        </section>
        <section id="css3">
            <h1>CSS3的历史</h1>
            <p>CSS3的历史正文</p>
        </section>
        <footer>
            <p>
                <a href="?edit">编辑</a>
                <a href="?delete">删除</a>
                <a href="?rename">重命名</a>
            </p>
        </footer>
    </article>
    <footer>
        <p><small>版权所有：小明</small></p>
    </footer>
</body>
</html>

nav元素推荐使用场合：

　　1、传统导航条

　　2、侧边栏导航

　　3、页内导航

　　4、翻页操作

时间： 2024-10-05 02:53:41

1-3、nav元素的相关文章

HTML5<nav>元素

HTML5中<nav>元素定义页面导航链接的部分区域,但并不是所有的链接都放到nav元素里面. 实例: <header id="pageHeader"> <h1>页面导航</h1> <nav id="pageNav"> <ul> <li><a href="#">HTML5</a></li> <li><a hre

什么是Nav元素 Nav元素可以用作页面导航的链接组,在导航链接组里面有很多的链接,点击每个链接可以链接到其他页面或者当前页面的其他部分,并不是所有的链接组都要被放在nav元素里面,我们只需要把最主要的.基本的.重要的放在nav元素里面即可. 比如说页脚底部如果有个版权申明,我们就不建议使用nav元素,而是使用footer元素是最合适的.一个页面中我们可用多个nav元素作为整体或者不同部分的导航 nav元素的用法 <body> <h1>nav的使用方法</h1> <

nav元素

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <h1>nav的用法</h1> <nav> <ul><li><a href="#">

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

结构元素不具有任何样式,只是使页面元素的的语义更加明确. header元素 header元素是一种具有引导和导航作用的的结构元素,该元素可以包含所有通常放在页面头部的内容.header元素通常用来放置整个页面或页面内的一个内容区块的标题,也可以包含网站Logo图片.搜索表单或者其他相关内容. <header> <h1>网页主题</h1> </header> 一个网页中可以使用多个header元素,也可以为每一个内容块添加header元素. nav元素 nav

【H5新增元素跟文档结构】新的文档结构 1. article 文章块 2. section 区块 3. nav 导航条

1. article 文章块 article 通常包括 header 跟 footer 结构 ① 用 article 设计一篇新闻稿语句: 1 <article> 2 <header> 3 <h1>文章标题</h1> 4 <time pubdate="pubdate">2017年9月26日消息</time> 5 </header> 6 <p> 7 文章内容 8 </p> 9 &

HTML5之新增的元素

今天打开博客看到自己有了一个小粉丝,说实话还是蛮开心的,坚持写博客大半年了,终于迎来了自己的第一个小伙伴.总算是坚持了那么久的事情看到了结果吧. 前几天参加了我们学院老师的比赛---<青年教师大赛的初赛>.我被我们老师拉去做了义工-----计时员.看了所有老师的比赛,虽然都特别好,但是让我印象深刻的还是一个HTMl5+CSS3的课程.看到那种炫酷的效果,我瞬间都被吸引住了.所以忙完了手头上的作业,就从别人那里要到了HTML5的教程,开始了我的学习HTML5之路.虽然看了6节课了,还是没有学到老

HTML5新增的结构元素

HTML5的结构一:新增的主体结构元素在HTML5中,为了使文档的结构更加清晰明确,追加了几个与页眉,页脚内容区块等文档结构相关联的结构元素. 1.1article元素 article元素代表文档,页面或应用程序中独立的完整的,可以独自被外部引用的内容,<article> 标签定义外部的内容.article元素是可以嵌套使用的,内层的内容在原则上需要与外层的内容相关联, 另外article元素也可以用来表示一个插件. <time> 标签定义日期或时间,或者两者.pubdate

HTML5学习笔记（三）：语义化和新增结构元素

在HTML5之前,使用机器来阅读一个网页是非常困难的,我们使用不同样式的div来标记不同的内容,所以实际上机器无法得知页面的哪个部分是正文,哪个部分是标题,那么在HTML5里,针对这个问题就引入了语义化的概念,同时提供了新的标签来指定对应的内容类型. 语义化的好处语义化的html只用来搭建网页的结构,去掉css后,网页结构不会变: 屏幕阅读器(如果访客有视障)会完全根据你的标记来“读”你的网页: 搜索引擎的爬虫也依赖于标记来确定上下文和各个关键字的权重: 你的页面是否对爬虫容易理解非常重要,因

HTML5新增与结构有关的元素

1.section元素 2.article元素 3.aside元素 4.header元素 5.hgroup元素 6.footer元素 7.nav元素 8.figure元素