【HTML入门学习笔记（二）】

HTML入门学习笔记（二）

参考: https://www.runoob.com/html/html-tutorial.html.

---

---

前言

多的⑧说，这次的任务是继续学习我们的HTML。

---

一、HTML 图像与链接

1.链接：

HTML使用标签 <a>来设置超文本链接。
“链接文本” 不必一定是文本。图片或其他 HTML 元素都可以成为链接。
超链接可以是一个字，一个词，或者一组词，也可以是一幅图像，您可以点击这些内容来跳转到新的文档或者当前文档中的某个部分。
当您把鼠标指针移动到网页中的某个链接上时，箭头会变为一只小手。
在标签<a>中使用了href属性来描述链接的地址。
默认情况下，链接将以以下形式出现在浏览器中：

• 一个未访问过的链接显示为蓝色字体并带有下划线。
• 访问过的链接显示为紫色并带有下划线。
• 点击链接时，链接显示为红色并带有下划线。

<a href="https://www.baidu.com">这是一个链接</a>

链接—id属性

id 属性可用于创建一个 HTML 文档书签。

• 在HTML文档中插入ID:

  <a id="tips">有用的提示部分</a>

• 在HTML文档中创建一个链接到"有用的提示部分(id=“tips”）"：
  <a href="#tips">访问有用的提示部分
  此处CSDN目录就是这样的应用.

• 或者，从另一个页面创建一个链接到"有用的提示部分(id=“tips”）"：
  <a href="https://www.runoob.com/html/html-links.html#tips">
  访问有用的提示部分

• 创建图片链接，如：
  

链接——target属性

<a href="https://www.baidu.com" target="_blank">这是一个链接</a>

添加了target="_blank"则会在新窗口打开

效果如下:

2.图像:

<img src="WPSP.png" width="550" height="550" />

效果如下：

注意此处相对路径与绝对路径的区别,不过多赘述了。

注意这里只是最基础的HTML的最基础的放入图片，博主也是一步一步慢慢学的，蹒跚学步了属于是。

二、HTML 元素

1.HTML元素语法

• HTML 元素以开始标签起始
• HTML 元素以结束标签终止
• 元素的内容是开始标签与结束标签之间的内容
• 某些 HTML 元素具有空内容（empty content）
• 空元素在开始标签中进行关闭（以开始标签的结束而结束）
• 大多数 HTML 元素可拥有属性

不要忘了结束标签！！！忘记使用结束标签可能会产生不可预料的结果或错误。

2.嵌套的HTML元素

大多数 HTML 元素可以嵌套（HTML 元素可以包含其他 HTML 元素）。

HTML 文档由相互嵌套的 HTML 元素构成。

3.HTML空元素

• 没有内容的 HTML 元素被称为空元素。
• 空元素是在开始标签中关闭的,<br>就是没有关闭标签的空元素（<br> 标签定义换行）。
• 在 XHTML、XML 以及未来版本的 HTML 中，所有元素都必须被关闭。
• 在开始标签中添加斜杠，比如 <br />，是关闭空元素的正确方法，HTML、XHTML 和 XML 都接受这种方式。
• 即使<br>在所有浏览器中都是有效的，但使用<br /> 其实是更长远的保障。

---

三、HTML 标题

1.标题

HTML的标题通过<h1>-<h6>定义的，<h1> 定义最大的标题,<h6> 定义最小的标题,CSDN编辑文章此处的一级标题到六级标题也是一个道理。

标题很重要
请确保将 HTML 标题 标签只用于标题。不要仅仅是为了生成粗体或大号的文本而使用标题。
搜索引擎使用标题为您的网页的结构和内容编制索引（CSDN此处的文章目录也可以通过点击直接跳转至各个标题的部分）。
因为用户可以通过标题来快速浏览您的网页，所以用标题来呈现文档结构是很重要的。
应该将 h1 用作主标题（最重要的），其后是 h2（次重要的），再其次是 h3，以此类推。

2.其他相关

（1）水平线

<hr>

（2）注释

<!-- 这是一个注释 -->

实例如下:

四、HTML 文本格式化

1.HTML 文本格式化标签

标签	描述
<b>	定义粗体文本
<em>	定义着重文字
<i>	定义斜体字
<ins>	定义插入字
<small>	定义小号字
<strong>	定义加重语气
<sub>	定义下标字
<sup>	定义上标字
<del>	定义删除字

2.“计算机输出” 标签

标签	描述
<code>	定义计算机代码
<kbd>	定义键盘码
<samp>	定义计算机代码样本
<var>	定义变量
<pre>	定义预格式文本

3.引文, 引用, 及标签定义

标签	描述
<abbr>	定义缩写
<address>	定义地址
<bdo>	定义文字方向
<blockquote>	定义长的引用
<q>	定义短的引用语
<cite>	定义引用、引证
<dfn>	定义一个定义项目

几个常用的例子:

<abbr title="World Wide Web">WWW</abbr>
<br>
<b>加粗文本</b><br><br>
<i>斜体文本</i><br><br>
<code>电脑自动输出</code><br><br>
这是 <sub> 下标</sub> 和 <sup> 上标</sup>

如图所示:

总结

目前感觉东西挺多的，况且这还只是基础中的基础，多用了熟练了才会牢牢记住。剩下的还有很多，HTML5也还没有开始学习，坚持隔一段时间学一部分吧，不过也得加紧进度了，争取HTML相关的学完了并且有个大概了解只之后还有充裕的时间去学习其它的比如JSP之类的吧，JEE这门课程也要边学边复习，剩下的路还很漫长啊。
加油加油加油！！！