标记的文本

HTML页面是由一个个标记及标记的属性和标记所表述的内容所组成,要学会制作网页,就要熟悉这些标记及相关的使用方法,然后熟练使用。标记数量很多,使用方法也比较繁杂,

而且因为HTML版本的不同,也有不少变化,具体内容可看网页或查看W3School官网。

虽然HTML的标记很多,但并不是都会要用到,更不必都要记住。而且随着HTML5新版本的推广,很多旧版的标记已经建议不再使用,会逐渐淘汰,只要掌握了少数常用的标记及其使用方法就可以编写不错的网页,这里只介绍部分常用的标记。

用于文本的标记:

文本是多数网站的主要内容,文本一般有字型、字号、对齐方式、黑体斜体等样式,还有下划线、上划线、删除线等特效,字体还有颜色及背景色,等等。

不过这些文本特性已经很少使用HTML来描述了,而是改为使用CSS,更加方便。不过,在一些场合,偶尔也会用到一些HTML标记,比如

用于描述强调的文本内容,一般情况下是用黑体来显示。示例:用标记的文本。

其他类似功能的标记还有:

标记的文本

标记的文本

标记的文本

标记的文本

标记的文本

文本的下划线、删除线也有相应的标记:

标记的文本

标记的文本

还有两种加删除线的方法,不过已经不建议使用了,将来浏览器会不再支持。

标记的文本

标记的文本

上述加下划线及删除线的方法可以使用CSS方式实现,通过定义文本的text-decoration属性分别为underline、line-through和overline表示下划线、删除线和上划线。

使用style="text-decoration:underline;"描述的文本

使用style="text-decoration:line-through;"描述的文本

使用style="text-decoration:overline;"描述的文本

上述方法是一种内联的CSS方式,具体方式及其他相关内容见CSS部分。

还有一类标记用来表示字体的大小,为

。样式为:

标记的文本

标记的文本

标记的文本

标记的文本

标记的文本

标记的文本

这种样式常用来定义文本标题,所以行间距很大,其中

更常用一些。这些样式其实可以使用CSS方式重定义,包括重定义间距,如果不重定义就按浏览器默认的样式显示。

文本的颜色及背景色一般也建议使用CSS方式,有时会用到内联式CSS来定义。示例:

使用style="color:red;"描述的文本

使用style="color:green;"描述的文本

使用style="color:blue;"描述的文本

使用style="background-color:red;"描述的文本

使用style="background-color:green;"描述的文本

使用style="background-color:blue;"描述的文本

使用style="color:red;background-color:green;"描述的文本

文本经常会用到换行、段落标记等,需要用到标记

。其中
只是换行,notepad或word等字处理软件中,文本末尾加上回车就可以换行,

但在HTML文本中则不起作用,必须加上
才能换行,不然几行会连在一起。示例:

结庐在人境,而无车马喧。

问君何能尔?心远地自偏。

不加换行就会显示在一行中,而每句后加上
就会为四行显示:

结庐在人境,而无车马喧。问君何能尔?心远地自偏。

类似还有一种标记,是一种软换行,主要用于西文网页中,西文单词比较长,如果在不恰当地方换行会造成单词分隔以产生歧义。在适当地方加入

如果在句子中间并不会产生换行,如果在一行尾部,就会在此地换行,而不造成歧义。在中文网页中很少使用。

是一种段落标记,比如上述诗句加上

就会与其他部分产生行间距。

结庐在人境,而无车马喧。

问君何能尔?心远地自偏。

如果每句都使用

,样式为:

结庐在人境,

而无车马喧。

问君何能尔?

心远地自偏。

还有一种产生文本段落格式的方法是使用

  • 这两种标记是嵌套使用的,总体上使用
      包围,而其中的每一项则使用
    • 包裹,格式为:

      • 结庐在人境,
      • 而无车马喧。
      • 问君何能尔?
      • 心远地自偏。

      而产生的样式为:

      结庐在人境,

      而无车马喧。

      问君何能尔?

      心远地自偏。

      类似还有一种

        ,也可以与
      1. 配合使用,这是一种有序项目,会自动加上前缀。样式为:

        结庐在人境,

        而无车马喧。

        问君何能尔?

        心远地自偏。

        这两种段落格式一般用来分隔相同等级的多个项目,而且还可以通过CSS样式来定义缩进量及每行的前缀标记等,不过具体内容在CSS时介绍。

        还有一种文本中经常使用的标记,这个标记包围起来的元素可以赋予某种样式,如果不设定样式并不会造成什么影响,主要作用就是用来把其中一部分分隔出来以便赋给特定样式。

        其使用方法会在网页布局部分再介绍。

        有时候需要在网页中显示一些包含指数的数学公式,或一些带下标的数学物理常数等,就会用到,分别表示上标和下标,示例:

        X2+2X+1=0

        log2π

        10100

        ∫∞(cos2(x))dx

        不过这种使用上标和下标的方法只能表示简单的上下标的公式,复杂的公式只能使用图片方式来引入。

        上述标记是用于文本的常用标记,其他还有一些只用于特殊场合,很少能见到了。比如用于显示程序源码,类似的还有

        关于文本常用的标记,还有一种

        用于产生表格,其中包括多种标记和属性,会在以后再介绍。