html5--2.6新的布局元素(5)-nav
html5--2.6新的布局元素(4)-aside/nav
学习要点
- 了解aside/nav元素的语义和用法
- 通过实例理解aside/nav元素的用法
- aside元素
- aside元素通常用来设置侧边栏。
- 用于定义article元素之外的内容,前提是这些内容与article元素内的内容相关。
- 同时也可嵌套在article元素内部使用,作为主要内容的附属信息,比如与主内容有关的参考资料,名词解释等。
- nav元素
- 通常用它给超链接分组用来定义导航栏,包括主导航栏,和侧边导航栏
- 并非所有的超链接都放在nav元素中,通常只把一个文档中的主导航栏放在nav中
- 在文章页面中,nav还可以用来给一个文章做一个目录的超链接
实例:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
nav{width: 100%;height: 40px;background: #FF6677;text-align: center;padding: 6px}
/*放在一行*/
li{display: inline;}
/*去掉a标签的横线*/
a{text-decoration: none;}
</style>
</head>
<body>
<nav><ul>
<li><a href="">首页</a></li>
<li><a href="">电脑办公</a></li>
<li><a href="">平面设计</a></li>
<li><a href="">设计素材</a></li>
<li><a href="">电脑办公</a></li>
<li><a href="">平面设计</a></li>
</ul></nav>
</body>
</html>
html5--2.6新的布局元素(5)-nav的更多相关文章
- html5--2.9新的布局元素(6)-figure/figcaption
html5--2.9新的布局元素(6)-figure/figcaption 学习要点 了解figure/figcaption元素的语义和用法 通过实例理解figure/figcaption元素的用法 ...
- html5--2.9新的布局元素(5)-hgroup/address
html5--2.9新的布局元素(5)-hgroup/address 学习要点 了解hgroup/address元素的语义和用法 通过实例理解hgroup/address元素的用法 对照新元素布局与d ...
- html5--2.7新的布局元素(4)-time
html5--2.7新的布局元素(4)-time 学习要点 了解微格式的概念 掌握time元素的用法 微格式的概念 HTML5中的微格式,是一种利用HTML5中的新标签对网页添加附加信息的方法,附加信 ...
- html5--2.1新的布局元素概述
html5--2.1新的布局元素概述 学习要点 了解HTML5新标签(元素)的优点 了解本章要学习的新的布局元素 了解本章课程的安排 HTML5新标签的优点: 更注重于内容而不是形式 对人的友好:更加 ...
- html5--2.5新的布局元素(4)-aside/nav
html5--2.5新的布局元素(4)-aside/nav 学习要点 了解aside/nav元素的语义和用法 通过实例理解aside/nav元素的用法 aside元素(附属信息) aside元素通常用 ...
- html5--2.4新的布局元素(3)-section
html5--2.4新的布局元素(3)-section 学习要点 了解section元素的语义和用法 通过实例理解section元素的用法 article元素和section元素的区别和共同点 art ...
- html5--2.3新的布局元素(2)-article
html5--2.3新的布局元素(2)-article 学习要点 了解article元素的语义和用法 完成一个简单的实例 article元素(标签) 用于定义一个独立的内容区块,比如一篇文章,一篇博客 ...
- html5--2.1新的布局元素(1)-header/footer
html5--2.1新的布局元素(1)-header/footer 学习要点 了解header/footer的语义和用法 使用header/footer进行一个简单的布局 header元素(标签) 用 ...
- HTML5中支持新的媒体元素有这些
HTML5对媒体的支持性很强,支持以下媒体元素: · audio 定义音频 · video 定义视频 · embed 作为外部应用的容器 · source 多种媒体源的支持 · track ...
随机推荐
- C语言八进制和十六进制数
一 赋值 int dex = 100;// 默认十进制 int oct = 0144;// 八进制,以0開始 int hex = 0x64;// 十六进制,以0x開始 二 输出 void show(i ...
- spring中的事件 applicationevent 讲的确实不错
event,listener是observer模式一种体现,在spring 3.0.5中,已经可以使用annotation实现event和eventListner里. 我们以spring-webflo ...
- 整合Kafka到Spark Streaming——代码示例和挑战
作者Michael G. Noll是瑞士的一位工程师和研究员,效力于Verisign,是Verisign实验室的大规模数据分析基础设施(基础Hadoop)的技术主管.本文,Michael详细的演示了如 ...
- Gmail上不去怎么办?
近期非常多人反映Gmail上不去.每到重大政治事件附近,国家的防火墙就会加固一些. 事实上仅仅要下一个软件就能够轻松解决Google.Gmail上不去的问题. 下载地址 下载解压后点击"我要 ...
- 【Caffe】利用log文件绘制loss和accuracy(转载)
(原文地址:http://blog.csdn.net/liuweizj12/article/details/64920428) 在训练过程中画出accuracy 和loss曲线能够更直观的观察网络训练 ...
- 目标检测之行人检测(Pedestrian Detection)基于hog(梯度方向直方图)--- 梯度直方图特征行人检测、人流检测2
本文主要介绍下opencv中怎样使用hog算法,因为在opencv中已经集成了hog这个类.其实使用起来是很简单的,从后面的代码就可以看出来.本文参考的资料为opencv自带的sample. 关于op ...
- 前端编程提高之旅(三)----浏览器兼容之IE6
在爱奇艺实习期间,乐帝主要负责移动端活动页面的制作,因为移动浏览器是随着智能手机兴起的,这就决定了移动端不会重蹈浏览器兼容问题的覆辙.一開始就比較好的支持web标准,而纵观整个互联网行业,移动web开 ...
- Oracle exp使用正則表達式导出部分表
假设数据库中有许多张表,而我们又仅仅想导出须要的那几张能够使用例如以下命令 --仅仅导出test1.test2表 exp myname/mypassword@orcl file = d:\my.dmp ...
- vue 流程设计器
github地址:https://github.com/280780363/gucflow.designer demo地址:https://280780363.github.io/gucflow.de ...
- 【Atheros】如何在驱动中禁用ACK
上一篇文章讲了如何禁用载波侦听(CSMA)和退避(BACKOFF)的方法,这一篇介绍如何禁用ACK. 禁用ACK主要分为三部分: 1. 在发送端设置不等待ACK回来就继续发送: 2. 在接收端设置收到 ...