nav元素

  nav元素是一个可以用作页面导航的链接组,其中的导航元素链接到其他页面或当前页面的其他部分。

并不是所有的链接组都要被放进nav元素,只需要将主要的、基本的链接组放进nav元素即可。

  nav元素的应用场景:

  • 传统的导航条
  • 侧边栏导航
  • 页内导航
  • 翻页操作

  

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>nav元素</title>
</head>
<body>
<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>
<h1>HTML5历史</h1>
<p>.....</p>
</section>
<section>
<h1>CSS3历史</h1>
<p>.....</p>
</section>
<footer>
<a href="#">删除</a>
</footer>
</article> <footer>
<p><small>版权声明:</small></p>
</footer> </body>
</html>

aside元素

  aside元素用来表示当前页面或文章的附属信息部分,他可以包含与当前页面或主要内容相关的引用、侧边栏、广告、导航条,

以及其他类似的有区别于主要内容的部分。

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>aside元素</title>
</head>
<body>
<header>
<h1>js入门</h1>
</header> <article>
<h1>语法</h1>
<p>文章的征文</p>
<aside>
<h1>名词解释</h1>
<p>语法:。。。。。</p>
</aside>
</article> <aside>
<nav>
<h2>评论</h2>
<ul>
<li><a href="#">2019-3-11</a></li>
<li><a href="#">大牛:嘿,bro!</a></li>
</ul>
</nav>
</aside> </body>
</html>

八(第二篇)、主体结构元素——nav元素、aside元素的更多相关文章

  1. 深入学习jQuery选择器系列第二篇——过滤选择器之子元素选择器

    × 目录 [1]通用形式 [2]反向形式 [3]首尾元素 [4]唯一元素 前面的话 在上一篇中已经介绍过基础选择器和层级选择器,本文开始介绍过滤选择器.过滤选择器是jQuery选择器中最为庞大也是最为 ...

  2. 第二篇 HTML 常用元素及属性值

    常用元素及属性值 先和同学了解下,一部分常用的元素,区别以及属性,常用在哪里.   标签是由左右尖括号抱起来的,由开始标签开始,再由结束标签结束,里面内容则是元素,比如:<div>< ...

  3. python自动化测试应用-第6篇(WEB测试)--Selenium元素篇

    篇6                            python自动化测试应用-Selenium基础篇 --lamecho 1.1概要 大家好!我是lamecho(辣么丑),上一篇我们搭建好p ...

  4. 章节八、3-如何用Chrome开发者工具查看元素

    一.如何使用开发者工具,操作步骤与火狐浏览器一致(此处不重复叙述,此处主要描述如何查找元素是否存在以及元素在页面中是否重复). 1.打开开发者选项,然后按“ctrl+f”,会出现一个输入框在输入框中输 ...

  5. [转]Android开源项目第二篇——工具库篇

    本文为那些不错的Android开源项目第二篇--开发工具库篇,主要介绍常用的开发库,包括依赖注入框架.图片缓存.网络相关.数据库ORM建模.Android公共库.Android 高版本向低版本兼容.多 ...

  6. 【OpenGL】第二篇 Hello OpenGL

    ---------------------------------------------------------------------------------------------------- ...

  7. Android开源项目第二篇——工具库篇

    本文为那些不错的Android开源项目第二篇——开发工具库篇,**主要介绍常用的开发库,包括依赖注入框架.图片缓存.网络相关.数据库ORM建模.Android公共库.Android 高版本向低版本兼容 ...

  8. {03--CSS布局设置} 盒模型 二 padding bode margin 标准文档流 块级元素和行内元素 浮动 margin的用法 文本属性和字体属性 超链接导航栏 background 定位 z-index

    03--CSS布局设置 本节目录 一 盒模型 二 padding(内边距) 三 boder(边框) 四 简单认识一下margin(外边距) 五 标准文档流 六 块级元素和行内元素 七 浮动 八 mar ...

  9. EnjoyingSoft之Mule ESB开发教程第二篇:Mule ESB基本概念

    目录 1. 使用Anypoint Studio开发 2. Mule ESB Application Structure - Mule ESB应用程序结构 3. Mule ESB Application ...

随机推荐

  1. 调用shutdown.sh后出现could not contact localhost8005 tomcat may not be running报错问题

    之前调用tomcat的shutdown.sh无法关闭tomcat,一直报could not contact localhost8005 tomcat may not be running错. 在网上找 ...

  2. 第一章01:熟悉java,发展历史

    1. java由来: 原公司,sun,后来被oracle\甲骨文公司收购 java,主要用于开发互联网软件,例如:QQ.迅雷.淘宝.京东

  3. 关于空指针NULL、野指针、通用指针 (转)

    reference:https://www.cnblogs.com/losesea/archive/2012/11/16/2772590.html 首先说一下什么是指针,只要明白了指针的含义,你就明白 ...

  4. 如何避免form提交进行页面跳转

    正常的form表单提交后需要进行页面跳转,如果我们不希望进行页面跳转,那么按以下两个步骤,通过一个iframe就可以解决这个问题: 步骤一:首先在页面中定义一个空的不可见的iframe <!-- ...

  5. kafka 分区和副本以及kafaka 执行流程,以及消息的高可用

    1.Kafka概览 Apache下的项目Kafka(卡夫卡)是一个分布式流处理平台,它的流行是因为卡夫卡系统的设计和操作简单,能充分利用磁盘的顺序读写特性.kafka每秒钟能有百万条消息的吞吐量,因此 ...

  6. BootstrapValidator . select 必须选择一个 .callback . select .option

    1.对于: 如果 只是引用 notEmpty , 不起作用.   因为 请选择教师  也是一个 option , 一个选项. 可以使用 callback. 'userId':{ message :'教 ...

  7. 05_解决mac百度网盘下载速度慢问题

    第一步:下载软件 下载工具包:aria2GUI和chrom插件 链接:https://pan.baidu.com/s/104t6aZXx9zfxBV9rS_eLfg  密码:yg96 ①下载Aria2 ...

  8. IC卡插入与触点激活时序

    当IC卡插入接口设备时,终端应确保其所有触点处于低电平状态: 当IC卡插入接口设备后,触点须按如下方式激活: 要点: 终端必须在整个激活时序中保持RST为低电平状态: 触点物理接触之后,应在IO或CL ...

  9. terminal、Shell、tty和console

    最早的电脑有带很多开关和指示灯的面板——console(概念来自管风琴),一台电脑通常一个Console,化为主机一部分,和CPU共享机柜. 一台大型主机往往支持多用户,每个用户使用的终端——term ...

  10. MySQL 5.7以上 root用户默认密码问题【转】

    https://www.yanning.wang/archives/379.html 废话少说一句话系列: CentOS系统用yum安装MySQL的朋友,请使用 grep "temporar ...