讲给Android程序员看的前端教程(03)——HTML5标签(2)

来源：互联网发布：男士去油洗面奶知乎编辑：程序博客网时间：2024/06/05 14:57

自定义View系列教程00–推翻自己和过往，重学自定义View
自定义View系列教程01–常用工具介绍
自定义View系列教程02–onMeasure源码详尽分析
自定义View系列教程03–onLayout源码详尽分析
自定义View系列教程04–Draw源码分析及其实践
自定义View系列教程05–示例分析
自定义View系列教程06–详解View的Touch事件处理
自定义View系列教程07–详解ViewGroup分发Touch事件
自定义View系列教程08–滑动冲突的产生及其处理

探索Android软键盘的疑难杂症
深入探讨Android异步精髓Handler
详解Android主流框架不可或缺的基石
站在源码的肩膀上全解Scroller工作机制

Android多分辨率适配框架（1）— 核心基础
Android多分辨率适配框架（2）— 原理剖析
Android多分辨率适配框架（3）— 使用指南

版权声明

本文原创作者：谷哥的小弟
作者博客地址：http://blog.csdn.net/lfdfhl
本文视频教程：http://www.stay4it.com/my/course/37

课程安排

HTML不是程序设计语言，而是一种标记语言，它用一些标记、标签来说明文本的显示效果。要制作网页和建立网站，就必须对HTML语言有所了解。客观地讲：HTML标签没有多少逻辑性而言，为了大家更好的理解和记忆，我们对这些标签进行分门别类的讲解，主要分为：

HTML常用标签
HTML文本标签
HTML语义标签
HTML结构标签
HTML列表标签
HTML表格标签
HTML表单标签
HTML新增标签和API

嗯哼，来吧，我们继续HTML标签的学习。咋了？你竟然有点担心学不会！？别逗了，这部分和我们常写的Java比起来简单多了，它的逻辑性也弱得多。所以，大胸弟你大可放心，就像你看电影那样：一手拿着爆米花，一手拿着可乐，也完全可以看懂本教程。

上次已经讲完了HTML常用标签，这次我们来学习HTML文本标签。

HTML文本标签

文本标签，顾名思义，它是用来显示文本的。在此，我们来瞅瞅HTML中经常使用的文本标签。

b标签

b标签常用于文本加粗，它对应于英文中的bold。

<b>b标签用于粗体显示文字</b>

strong标签

strong标签的作用和用法与b标签基本相同，但是在HTML5中为strong标签增加了语义，用其表示重要的文本。

<strong>strong标签用于粗体显示文本，表示重点内容</strong>

small标签

small标签用于显示小号字体，比如：版权信息，法律信息，免责声明

<small>本文的原创作者是谷哥的小弟</small>

有人在想：既然有了samll标签，那么是不是有对应的big标签呢？嗯哼，以前确实是有这个标签的，但是在HTML5中已经将其删除了。

i标签

i标签用于将文本斜体显示，它源于英语单词italic；常用于显示专业词汇，术语，谚语。

<i>service</i>

em标签

em标签表示将文本斜体显示，它源于英语单词emphasize.

<em>这里是考试的重点</em>

看到这里，有的童鞋就有疑问了：i标签和em标签都将文本斜体显示，它们有什么区别么？b标签和strong标签都将文本粗体显示，它们有什么区别呢？

b标签和i标签仅仅表示”此处应该用粗体显示”或者”此处应该用斜体显示”，例如，要突出合同的价格那么可以用b标签粗体显示；要表达一句谚语，可以用i标签将其斜体显示。
strong标签和em标签是为了强调内容的重要意义而显示粗体或者斜体；对于搜索引擎，爬虫，SEO而言更受重视。例如，我们将”打倒法西斯！”这句话置于strong标签中；那么，语音阅读器时读到此strong标签就会重读。
概括地来说：b标签和i标签是物理元素；strong标签和em标签是逻辑元素。物理元素强调的是一种物理行为。比如说，把一段文字用b标签加粗，意思是告诉浏览器应该加粗显示，没有其他作用；而strong标签不但加粗了字体还起到了强调的作用。同理，i标签和em标签类似，故不再赘述。

u标签

u标签用于表示文本下划线，它源于英文单词underline；请看如下示例：

<u>u标签标示文本的下划线</u>

sup标签

sup标签用于表示文本的上标，它是英文单词superscript的缩写；请看如下示例：

这里是上标<sup>1</sup>

sub标签

sub标签用于表示文本的下标，它是英文单词subscript的缩写；请看如下示例：

这里是下标<sub>2</sub>

span标签

span用于组合文档中的行内元素；它常结合CSS为文本中的某些部分进行特殊处理。说到这里，大家是不是猛然想起来Android里也有类似的东西！比如，要把一部分文字改变颜色，还记得我们在Android里面怎么做的呢？是不是利用SpannableString就可以了？！你瞅瞅，它是不是也是个span呢？所以，这两者是互通的，知道了其中一个，另外一个自然也理解了。

<span style="color:#FA0">大家好</span><span style="color:#F00">我是谷哥的小弟</span>

font标签

font标签用于给文本设置文字大小和颜色等属性。示例如下：

<font color="red" size="15">测试font</font>

虽然font标签可以给文本设置样式，但是在HTML5中建议不再使用该标签，可采用CSS实现相同的功能。

源码和页面

在此，附上刚才所讲标签时涉及到的源码

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>HTML常用文本标签</title></head><body>    <!-- b标签，用于将内容加粗显示-->    <b>b标签用于粗体显示文字</b>    <br>    <br>    <!-- strong标签，用于表示重点内容-->    <strong>strong标签用于粗体显示文本，表示重点内容</strong>    <br>    <br>    <!-- small标签用于显示小号字体，常用于表示：版权信息，法律信息，免责声明 -->    <small>本文的原创作者是谷哥的小弟</small>    <br>    <br>    <!-- i标签用于将文本斜体显示-->    <i>service</i>    <br>    <br>    <!--em标签表示将文本斜体显示 -->    <em>这里是考试的重点</em>    <br>    <br>    <!-- u标签 -->    <u>u标签标示文本的下划线</u>    <br>    <br>    <!-- sup标签，表示上标-->    这里是上标<sup>1</sup>    <br>    <br>    <!-- sub标签，表示下标 -->    这里是下标<sub>2</sub>    <br>    <br>    <!-- font标签用于给文本设置文字大小和颜色等属性-->    <font color="red" size="15">测试font</font>    <br>    <br></body></html>

页面在谷歌浏览器的显示效果如下图：

阅读全文

6 0