HTML标签详解之文本标签 -365PHP培训与交流平台

今天的HTML教程是学习HTML文本标签，其中包括6个等级的标题和修改文本样式的HTML标签。

1、标题标签：<h1>...<h6>，用来定义文章的标题，<h1>最大，<h6最小>

文本查看复制代码打印关于

1. <h1>标题1 -365PHP培训与交流平台</h1>  
2. <h2>标题2 -365PHP培训与交流平台</h2>  
3. <h3>标题2 -365PHP培训与交流平台</h3>  
4. <h4>标题2 -365PHP培训与交流平台</h4>  
5. <h5>标题2 -365PHP培训与交流平台</h5>  
6. <h6>标题6 -365PHP培训与交流平台</h6>  

<h1>标题1 -365PHP培训与交流平台</h1><h2>标题2 -365PHP培训与交流平台</h2><h3>标题2 -365PHP培训与交流平台</h3><h4>标题2 -365PHP培训与交流平台</h4><h5>标题2 -365PHP培训与交流平台</h5><h6>标题6 -365PHP培训与交流平台</h6>

 

2、文本样式标签<b>、<i>、<u>，分别是加粗、斜体和下划线，类似于Word的功能。

文本查看复制代码打印关于

1. 这是<u>365PHP</u><b>HTML</b><i>课程</i>  

这是<u>365PHP</u><b>HTML</b><i>课程</i>

 

与<b>、<i>标签效果相同的还有另外两个标签<strong>和<em>标签

文本查看复制代码打印关于

1. 这是<b>HTML</b><i>课程</i>  
2. <br />  
3. 这是<strong>HTML</strong><em>课程</em>  

这是<b>HTML</b><i>课程</i><br />这是<strong>HTML</strong><em>课程</em>

 

虽然标签在浏览器上的效果是相同的，但是两个标签所表达的含义是完全不一样的，<b>、<i>标签只是做样式修改，加粗和斜体。但是<strong>和<em>标签则代表的是强调的意思，<strong>强调的是对整段、整篇的文本进行重点突出。<em>则是局部强调，比如一个句子中的某一个词组或字母等，突出其含义，突出其重要性。所以大家在使用的时候要注意区分。

这里要注意，搜索引擎对于<strong>和<em>标签中的内容有特殊的照顾，会抓取其中的内容，所以一般我们会用这两个标签强调页面内容中的关键词，便于搜索引擎收录。

3、<sub>、<sup>，定义下标文本和上标文本，比如H2O中的2的位置应该往下些，X的4次方，4的位置应该往上些，如果要达到这样的效果就可以使用者两个标签

文本查看复制代码打印关于

1. H₂O X³  

H<sub>2</sub>O X<sup>3</sup>

 

 4、<blockquote>标签设置引用文章，在段落需要引用较长的文章时使用，效果就是文字左右为缩进状态

文本查看复制代码打印关于

1. 365PHP   
2. <blockquote>PHP培训与交流平台</blockquote>  

365PHP<blockquote>PHP培训与交流平台</blockquote>

 

5、<font>标签，用于定义文本的字体风格，字体颜色和字体大小

文本查看复制代码打印关于

1. <font face="Verdana, Geneva, sans-serif" color="#C60A00" size="7">HTML是什么？</font>  

<font face="Verdana, Geneva, sans-serif" color="#C60A00" size="7">HTML是什么？</font>

 

<font>标签属性：

• face属性：设置字体风格，可以定义多个字体，用","逗号隔开，在浏览时根据客户端具有的字体进行选择显示，例如我浏览该网页时，首先会选择face属性的第一个字体"Verdana"，假设我本地没有该字体，则会选择下一个字体"Geneva"，以此类推，如果face属性设置的字体本地都没有的话，则会使用默认字体。
• color属性：字体颜色，可以使用十六进制的RGB表示，也可以使用颜色常量表示，颜色的设置参见HTML架构标签
• size属性：字体大小，可以设置从小到大1~7的共7个值，或者可以设置+3或-3这样的值，指在当前大小的基础上增加或减少3个大小

 

阅读本文的人还阅读：

HTML是什么？

HTML标签

HTML元素

HTML属性

HTML规范

作者：马明@PHP培训 PHP修订1.0 2009-07

365PHP，中国PHP在线培训第一品牌

本文365PHP版权所有，未经批准转载必究。