![Web标准网页设计原理与前端开发技术](https://wfqqreader-1252317822.image.myqcloud.com/cover/748/26793748/b_26793748.jpg)
4.1 表现性元素
HTML 4.01规范定义了近100种元素,每种元素都起着特定的作用。其中,某些元素能够使其作用的内容表现出特定的视觉效果,这些元素也因此被称为表现性元素(Presentational Element)。
【例4-1】 在HTML文档中使用表现性元素,并观察这些元素对其内容产生的特定视觉效果。具体步骤如下:
(1)在Notepad软件中输入以下HTML代码。
![](https://epubservercos.yuewen.com/80F03B/15253388205240406/epubprivate/OEBPS/Images/Figure-P47_6637.jpg?sign=1738883482-V4xQVNZcduE7SD1PghttVJI2wbO0OHcT-0-05804953eb1731581eeead5816926021)
(2)在Notepad软件中保存HTML文档,并将其命名为4-1.htm。
(3)使用IE浏览器打开HTML文档4-1.htm。网页的浏览效果如图4-1所示。
![](https://epubservercos.yuewen.com/80F03B/15253388205240406/epubprivate/OEBPS/Images/Figure-P48_6645.jpg?sign=1738883482-1pBt2n84jI8TLLBJ51JERY8rJtuM6fgv-0-7391db349bcfe74b0bec0746fae75de0)
图4-1 使用IE浏览器打开HTML文档
在本例中,s、strike、u(underlined)、center、i(italic)、em(emphasis)、b(bold)和strong(strong emphasis)等元素有一个共同的特性:使其作用的内容表现出特定的视觉效果。无论是给文本添加删除线和下画线、显示文本的粗体和斜体效果,还是对文本进行水平居中、或是把文本定义为强调的内容,都是使内容(文本)表现出特定的视觉效果。因此,s、strike、u、center、i、em、b和strong等元素属于表现性元素。
然而,现在的HTML建议不使用s、strike、u和center元素,这些元素也因此称为被废弃的元素(Deprecated Element)。被废弃的表现性元素及其作用已经被样式(Style)所取代。使用样式同样能使元素作用的内容表现出特定的视觉效果。有关样式的相关概念和用法将在第5章中介绍。
在em元素后使用了br元素。在HTML中,br元素是一个空元素,可以没有结束标签,用来定义强制性换行(forced line break)。
同i和b元素类似,em和strong元素也能使它们作用的文本内容倾斜或加粗。但em和strong元素的语义性更强,而且对搜索引擎(如Google)更加友好,容易被搜索引擎捕获和收录。所以,推荐使用em和strong元素替代i和b元素。
如图4-1所示,如果i、em、b和strong等元素在HTML文档中依次出现,这些元素中的内容在网页的同一行中从左向右依次排列。因此,这些元素也称为行内元素(Inline Element),或内联元素。而center元素中的内容在网页中独占一行,center元素也因此称为块级元素(Block-Level Element)。