HTML&CSS基础学习笔记1.11-导航栏

昔人已老

2016-07-23

上一篇html的博客，我们介绍到的<a>标签，由于<a>标签可以用来跳转，所以我们可以拿<a>标签来生成网页的导航栏。

其实在实际运用中，<a>标签就经常会被用来生成导航栏。

导航栏在HTML中有一个语义化的标签<nav>，这个标签表示带有导航性质的内容，会有自己默认的特殊样式。语义化标签我们将会在后面讲到。

我们在这里先使用下<nav>标签，和<a>组合成一个导航栏。

代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
　　<meta charset="UTF-8">
　　<title>生成导航栏</title>
</head>
<body>
<h1>使用nav标签生成导航栏</h1>
　　<a href="https://www.baidu.com">百度</a><a href="http://im.qq.com/">QQ</a> <a href="http://www.mayacoder.com/index">码芽</a>
</body>
</html>

结果如何？

HTML&CSS基础学习笔记1.11-导航栏

更多内容学习就在码芽网 http://www.mayacoder.com/lesson/index

html代码 css css样式

昔人已老

0 关注 0 粉丝 0 动态

相关推荐

css基础教程

HTML 标签原本被设计为用于定义文档内容。通过使用 <h1>、<p>、<table> 这样的标签，HTML 的初衷是表达“这是标题”、“这是段落”、“这是表格”之类的信息。同时文档布局由浏览器来完成，而不使用任何的格式

冰蝶 2020-07-04

通过css润色html表格

--th和td都是单元格，th里的内容会默认加粗并且居中 -->. 这样是不是高档了很多。

coulder 2020-06-09

前端如何实现.md文件转换成.html文件

.md文件是markdown的一种标记语言，和html比较起来，更简单快捷，主要体现在：标记符的数量和书写上。下面介绍如何实现将.md文件转换成.html文件。

lupeng 2020-11-14

10个对Web开发人员有用的HTML文件上传技巧

上传文件功能可以说是项目经常出现的需求。从在社交媒体上上传照片到在求职网站上发布简历，文件上传无处不在。在本文中，我们将讨论 HTML文件上传支持的10种用法，希望对你有用。我们可以将input 类型指定为file，以在Web应用程序中使用文件上传功能。

sjcheck 2020-11-10

手把手教你搭建Vue服务端渲染项目

好了，下面开始正文。服务器返回一个包含了引入资源语句和 <div id="app"></div> 的 HTML 文件。服务器会查看当前路由组件需要哪些资源文件，然后将这些文件的内容填充到 HTML 文件。如果有

sjcheck 2020-11-03

快速指南：如何创建基于Python的爬虫

Web抓取的使用正在积极增加，特别是在大型电子商务公司中，Web抓取是一种收集数据以竞争，分析竞争对手和研究新产品的方式。Web抓取是一种从网站提取信息的方法。在本篇文章中，学习如何创建基于Python的刮板。深入研究代码，看看它是如何工作的。在当今的大数

meylovezn 2020-08-28

HTML知识点（一）

五大主流浏览器：火狐浏览器?————因为内核不同???不是一个标准，而是一个标准的集合。所谓超文本，因为它可以加入图片、声音、动画、多媒体等内容，不仅如此，它还可以从一个文件跳转到另一个文件，与世界各地主机的文件连接

owhile 2020-08-18

再见HTML ! 用纯Python就能写一个漂亮的网页

大家好，今天给大家带来一个炫酷的神器！我们在写一个网站或者一个网页界面的时候，需要学习很多东西，对小白来说很困难！要懂后端，比如Python里面的Django或者Flask，或者是Java里面的SpringBoot. 其实我就给老板做一个简单的交互的页面，

Francismingren 2020-08-17

在html页面中引入另一个html页面

我们在使用html编写一个网站的时候，通常情况下头部和尾部是相同的，如果一个网站的每个页面都把这些代码写一遍，不仅浪费时间，还显得重复代码很多，所以此时把重复的页面单独摘出来，在用到的时候从外部直接引进去，就能节省很多时间，减少很多代码。如果有些浏览器本地

pythonclass 2020-07-29

用urllib库几行代码实现最简单爬虫

使用urllib.request()请求一个网页内容，并且把内容打印出来。# 存取到内存当中是bytes流，使用read方法把rsp的内容读取出来，赋值给变量html。# 使用decode解码成我们能够看懂的格式。D:\ProgramData\Anacon

sunzhihaofuture 2020-07-19

JavaScript HTML DOM 事件

HTML DOM 使 JavaScript 有能力对 HTML 事件做出反应。我们可以在事件发生时执行 JavaScript，比如当用户在 HTML 元素上点击时。onload 事件可用于检测访问者的浏览器类型和浏览器版本，并基于这些信息来加载网页的正确版

爱读书的旅行者 2020-07-07

HTML 语义

HTML 并不简单，它是典型的“入门容易，精通困难”的一部分知识。深刻理解 HTML 是成为优秀的前端工程师重要的一步。语义是我们说话表达的意思，多数的语义实际上都是由文字来承载的。现在很多的前端工程师写起代码来，多数都不用复杂的语义标签，只靠 div

行吟阁 2020-07-05

如何理解HTML语义化的？

通常由PHP后端来写HTML，但是他们并不会CSS，于是就用table来进行布局。但我们都知道，table其实是用来展示表格的，这一条就与语义化严重相悖。后来前端慢慢分离成一个单独的岗位，他们会使用DIV+CSS布局，并且主要利用float和绝对定位进行布

tianqi 2020-07-05

python之发送邮件----html + 附件

补充说明：文章两次邮件代码都是以163邮箱作为例子，不同的邮箱发送连接该邮箱的smtp服务代码不进行备注说明了，详情说明科参考代码下面地址，或者博主上一篇文本类型代码import smtplibfrom email.mime.text import MI

行吟阁 2020-07-04

C# 使用 WebBrowser 实现 HTML 转图片功能

在 .NET 平台上，我们有多种方式可以将一段 HTML 文本转换为一张图片：HTML Renderer、SelectPdf、Aspose.Html等。WebBrowser 具备显示 HTML 的功能，又因为其从 Control 类型派生，所以包含Draw

lyg0 2020-07-04

JavaScript 事件

HTML 事件是发生在 HTML 元素上的“事情”。当在 HTML 页面中使用 JavaScript 时，JavaScript 能够“应对”这些事件。通常，当事件发生时，用户会希望做某件事。JavaScript 允许您在事件被侦测到时执行代码。在上面的例子

owhile 2020-07-04

Java学习（十二）

今天安装讲师推荐下载了一个叫Hbuiler X的IDE，并且学习了选择器的知识。选择器1选择器2{}//同时满足2个选择器条件的才会使用大括号内的样式也可以选中全页面统一样式。static{}中的代码叫做静态代码块，在类加载时执行，且只执行一次，从上而下的

opspider 2020-06-28

结合puppeteer和egg.js搭建html转pdf或png的node中间层服务。

后面经过使用链接池的优化，chrome的耗时成功降下来。由于项目比较看重时间损耗，所以最终选择puppeteer。本文将讲述puppeteer的一些优化措施，以及怎么结合egg.js搭建成最终的服务器。

lengyu0 2020-06-28

JavaScript的加载顺序

在HTML中，JavaScript可以写到程序的任何地方：<HTML>标签前， <BODY>标签前，<BODY>标签里面, <BODY>标签后, <HTML> 标签后.<h2 id =‘pp

tianqi 2020-06-21

html的基本标签

当我们需要写页面的时候，肯定会用到一些html的基本标签，现在我们就来罗列下我们常用的html的基本标签有哪些。--申明文档类型 html-->. --申明编码集-->　　 <style></style><!--身

dadaooxx 2020-06-16

昔人已老

W3CSchool教程: HTML 教程; CSS 教程; Bootstrap 教程; Javascript 教程; jQuery 教程

后端教程: C 教程; Java 教程; PHP 教程; Python 教程; Go 教程

移动开发: Android 教程; Swift 教程; Kotlin 教程; jQuery Mobile 教程; ionic 教程

关于我们: 新闻动态; 联系方式; 招聘英才; 安科实验室; 帮助与反馈

安科网(Ancii)，中国第一极客网

Copyright © 2013 - 2019 Ancii.com

京ICP备18063983号京公网安备11010802014868号