文本标签的作用
文本是网页当中最重要的内容，但是现在用户没有那么多的耐心去读大量的文本，所以说我们这些开发者就需要把文本打扮的好看一些，这样才能吸引住用户为数不多的注意力。文本标签的目标就是对文本的内容进行装饰，例如加粗字体，为文字加上下划线等等。
HTML当中提供了非常丰富的文本标签，从大的方面来说可以把这些文本标签分为两个大类，
第一类是视觉标签主要的作用是装饰文本的作用，例如将文本变为斜体或者是加黑等等，
另一类是语义标签，主要的作用还是装饰文本，例如将文本变为斜体或者是加黑等等。
看到这里，可能很多朋友已经禁不住要吐槽我了，你TM是不是在逗我，这不都一样么，为什么还要分为两类呢？难道就是因为要显示术语的专业性，要知道强行装逼最为致命！慢着！大家先不要着急扔砖头，请听我慢慢道来。要想理解这两种标签的区别，就必须首先要理解一个非常重要的概念--机器阅读！
在上一节课程当中我们为大家解释了一下HTML的作用是用来装饰内容，装饰过后的内容主要是可以让用户更好的阅读。但是我们知道，除了人要去读网页之外，机器也要去读网页。最典型的就是搜索引擎，类似于Google和baidu这样的搜索引擎，无时无刻不在读取着互联网当中的各种网页。当然，可能很多朋友不知道这个世界上还有一个叫做Google的网站，这是为什么呢？因为百度一下你就知道，Google一下你就知道的太多了！好吧，开个玩笑，还是让我们回到正题。为了搞清楚机器阅读究竟是什么，首先要搞清楚以下的两个问题：
-
搜索引擎为什么要读取网页？搜索引擎不断的读取网页的原因是需要为互联网上的所有网页编制索引，就是说搜索引擎从网络上读取一个网页，先把这个网页存储起来，然后分析这个网页当中内容，将其中的关键字提取出来，然后按照关键字出现的重要程度以及次数，将这些关键字编制成为索引。当我们使用搜索引擎搜索一个关键字的时候，搜索引擎就直接到索引库里面去查找，而不是直接查找网页本身的内容。这样就可以大大的增加搜索的速度了。
-
搜索引擎是如何判断哪些字是关键字呢？是根据词汇出现的位置和出现的次数，例如一个词汇出现在标题当中就计算五分，被加黑的词汇计算三分，如果是普通的文本，那就计算一分。就这样把整篇网页当中的每一个词汇都进行统计，计算出哪些词汇的得分最高，并将这些词汇编入到索引当中。
明白了以上的道理之后就比较容易理解什么文本标签的分类了，对于如果是视觉标签，将文本内容加粗或者是改变成为斜体，仅仅是为了让用户查看起来更加的方便，而对于语义标签来说，不仅仅要装饰问题，同时还起到了强调的作用。简单的来说视觉标签的加粗就仅仅是加粗，对于机器阅读而言，这样的加粗没有意义。如果是语义标签当中的加粗标签，不但会加粗文本，同时还会起到强调的作用，在机器阅读时，这样的文本就会有更高的分数，会被搜索引擎认为是更加重要的内容。
在明白了这两种文本标签的作用之后，下面让我们来看一下比较常用的文本标签有哪些。这张表格里面列出了常用的标签以及它们的作用。大家可以参考代码编写的截图和程序运行的截图来理解！
自学Mars老师的HTML5视频教程第一季第三集--文本标签。
代码地址：https://github.com/HXQWill/Quan_Mars_HTML/blob/master/textHtml.html
<!DOCTYPE html>
<html>
<head>
<title>textHtml</title>
<meta charset="utf-8">
</head>
<body>
<!--h系列标签加粗加大强调作用-->
<h1>h1</h1>
<h2>h2</h2>
<h3>h3</h3>
<h4>h4</h4>
<h5>h5</h5>
<h6>h6</h6>
<b>b粗体-视觉</b>
<br>
<strong>strong粗体+强调-语义</strong><br>
<i>i斜体</i><br>
<em>em斜体+强调</em><br>
<del>del删除线</del><br>
<q>q双引号表引用</q><br>
<small>small小号字体</small><br>
<sub>sub下标</sub>正常<sup>sup上标</sup><br>
<u>u文字下划线</u>
</body>
</html>
扫一扫
26万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
