HTML5学习：语义元素nav

HTML5学习：语义元素nav

一、定义
标签<nav>定义导航链接的部分,用来将具有导航性质的链接划分在一起，使代码结构在语义化方面更加准确，同时对于屏幕阅读器等设备的支持也更好。

二、用法
格式：<nav><a href="#">test</a></nav>，示例代码如下：

< !DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  </head>

  <body>
    <nav>
            <a href="#">TEST</a>
            <a href="/baidu">百度一下</a>
            <a href="/51cto">51CTO论坛</a>
    </nav>
  </body>
</html>

结果如下:

时间： 2024-10-12 14:50:24

HTML5学习：语义元素nav的相关文章

HTML5的语义元素有什么作用？

如今,web开发慢慢走向了html5的时代,今天主要说说 html5的语义化元素的意义 1.容易修改和维护.在html5出来之前,传统的网页基本是div用来布局,要想理解整体布局和不同区块的重要程度,其实是有点困难的(虽然说可以加上语义化的类):而通过html5语义元素,通过标记就可以迅速了解基本结构信息.这样,等你几个月回头修改时,就会比较轻松了.并且,当别人接手你的项目时,就显得更重要了! 2.无障碍性.方便屏幕阅读器和其他辅助工具对页面进行扫描,为让残疾人士提供更好的上网体验 3.搜索引擎

HTML5学习笔记（二）：用于构建页面的语义元素

1.语义元素大多数HTML5语义元素的用途是标识页面中的一个内容区块,为标注的内容赋予额外的含义,不真正做任何事. 2.使用语义元素的原因容易修改和维护: 无障碍性(现代Web设计的一个重要主题): 对搜索引擎的友好性高: 适应未来的浏览器和Web设计工具的发展趋势 3.语义元素的来历在发明HTML5之前,其发明者花很长时间研究已有的网页,还研读了谷歌对十几亿个网页的统计信息.谷歌公布的这个调查分析并列出了Web作者在自己网页中使用的类名,将Web页面中一些共性的东西(比如页面都有页眉.页

HTML5 语义元素(一)页面结构

本篇主要介绍HTML5增加的语义元素中关于页面结构方面的,包含: <article>.<aside>.<figure>.<figcaption>.<footer>.<header>.<main>.<nav>.<section>等元素. 目录 1. 语义元素介绍 1.1 何为语义元素 1.2 特点 2. 原先界面布局 3. 页面结构语意元素 3.1 说明 3.2 详细介绍 3.3 示例图 1. 语义元

努力学习 HTML5 （4）—— 浏览器对语义元素的支持情况

经过上一节学习,我们已经建立一个结构良好的页面,如果在旧版的 IE 浏览器中浏览可能这些语义元素无法显示. 毕竟这些语义元素什么也不做,要支持它们,只要让浏览器把它们当做普通的 <div> 元素就行了.为此我们要做的就是为它们添加点样式规则.之后就可以得到超级可靠的语义元素了,即使使用10年前的浏览器也可以正常浏览. 为语义元素添加样式浏览器遇到不认识的元素时,会把它们当做内联(inline)元素.大多数 HTML5 语义元素都是块级元素. 因此我们添加一条超级规则,为9个 HTML5 元素

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

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

HTML5学习：语义元素section

HTML5学习:语义元素section一.定义<section> 标签定义文档中的节(section.区段).比如章节.页眉.页脚或文档中的其他部分. 二.用法section标签下一般有一个标题<h1></h1>.还有一个内容<p></p>.示例代码如下: <!DOCTYPE html> <html> <head> <meta name="content-type" con

HTML5学习：语义元素article

HTML5学习:语义元素article 一.定义<article> 标签定义外部的内容.外部内容可以是来自一篇文章,或者来自博客的博文,或者是来自论坛的文章. 二.用法格式和上篇的section元素一样:<h1></h1><p></p>,示例代码如下: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type"

html5学习笔记(3)--主题结构元素-1

html5学习笔记(3)--主题结构元素-1 Article元素以下为对应代码: <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> </head> <body> <article> <header> <h1>极客学院</h

HTML5的文档结构和新的语义元素

学习前端的东西似乎没有什么捷径,就是直接上手撸就完了本文目标:(熟知) 1.创建基本HTML5文档结构 2.使用新的语义元素来布局页面下面直接上代码: <!DOCTYPE html>  <html lang="en">  <head> <meta charset="UTF-8">