第2章 用HTML标记和格式.ppt

第2章 常用HTML标记和格式 通过第1章的学习，对HTML有了一定的认识。HTML由标记（本书中标记与标签是同一概念）组成，其中有单标记和双标记之分，大部分以双标记出现，即标记对（也称标签对）。而本章要介绍的是应用中常用的HTML标记和格式，这些知识点往往在网页中会常用到，也是必须得掌握的知识点之一。在讲解过程中分两部分：标记和格式，学完本章，应掌握以下内容： 标题标记 段落标记 换行与注释 粗体与斜体 删除线 上标与下标 2.1 设置正文的标题 现在网络媒体在新闻传播中起的作用越来越大，其传播速度和内容丰富程度都超越了传统媒体。如从现在的门户网站新闻点击率上，可以看出网民直接在网上看新闻的热情。那么新闻的格式中，有新闻主题和新闻内容之分，往往新闻主题的字体大小比正文内容大，也会看到很大或比较小的标题。如果读者细心的话，会发现标题从大逐渐变小是有规律的。 2.1.1 标题设置的语法 本节来学习标题的设置，标题的作用是用精简的文字概括整篇文章的主题，故文字字不能太长，从外表上突出标题与内容。标题的语法很简单，由双标记组成，在尖括号对里面输入h加从1到6的任意一个数字即可，数字不同，所表达的标题大小效果也不一样，其完整标题语法如下： h#主题文字/h# 其中“#”是标题里面从1到6数字的任意的一个，系统一共提供6种标题，从数字1到数字6，标题大小由大到小，即表示不同大小的标题。换言之，数字越大，标题字体就越小。 2.1.2 标题设置经典案例――字号由大到小 理解了标题是由字母H加从1到6的数字后，下面用实例来演示这6个标题的效果，代码2.1表示从H1到H6的标题。 代码2.1 源代码\第2章\六种不同的标题.html html head title标题标记/title /head body !—下面是标题标记对-- h1标题h1/h1 h2标题h2/h2 h3标题h3/h3 h4标题h4/h4 h5标题h5/h5 h6标题h6/h6 /body /html 2.2 设置段落 一篇文章由标题和正文组成，正文又是由多个段落组成的，所以可以说段落是构成文章的主体。既然一篇文章是由多个段落组成的，那么又如何区分段落呢？段落与段落之间有什么不同呢？带着这些问题来学习本小节的段落标记。 在学习段落与段落的区别前，先了解段落的基本语法，段落语法代码是由尖括号对里放置p的双标记来表示，在标记对里面放置的内容就构成了一个段落。段落完整语法表示如下。 p这里表示段落/p 在p/p标记对中就表示的一个段落，那么怎样在一篇文章中存放多个段落呢？很简单，每个标签对就表示一个段落，有多少段落就有多少p/p，这就是从代码上区别段落与段落的不同。同理，从网页表现出的效果来看段落，段落与段落间有一行空格不显示任何内容，也就是常常看到新闻中的段落间有空行。那么可以利用HTML的段落标记来显示出文章内容美观效果，使用户对文章理解有层次感。段落不管是在新闻还是书籍中都会出现，下面请看段落在网页中如何表现其效果，如代码2.2所示。 2.3 强制换行 写文章时，往往要在一个段落中间另起一行，这就要用到换行，在网页中也可以表示换行的，但需要换行标记。换行可在行文中另起一行，显示出段落层次性，给人感觉更有亲和力。 在网页编写代码时的换行与按回车键的换行是不同的，即在编写HTML代码中的回车只多了一行空格，在代码中另起一行，但浏览器解释时，会忽视多余空格，只保留一个空格的位置。从2.2节中介绍的，得知网页显示中会去掉里面空格，与正常文档换行不同，所以没达到换行效果。而今天学习的换行就是在网页编写换行代码标记后将在页面中显示出换行效果，当浏览器在解释换行代码时会强制换行，这样在网页中就达到用户在输入时的换行标记的效果。 换行标记是音标记，即不会成对出现，语法是在尖括号中包括br的单标记，其完整语法代码如下所示： br 2.4 给代码注释 制作大型网站的时侯，每个网页程序员所做的工作都会不同，但相互依赖其他程序员写的代码。为了在同一个项目中让其他程序员看得明白，常常用注释来说明代码功能。注释代码的内容不会在网页中显示，只起到注释作用，如一个网页中头部用注释说明该页面的作用和创建日期，和本网页所展示的功能等，让其他程序员或学习者看到注释就知道代码内容。 在前面的代码中，多次出现了注解符，而且在注解内容中，笔者都在前面标记“注解：”，为了告诉初学者代码的意义，所采用的一种解说代码方法，并不会在网页中显示注解内的内容。注释语法比较容易，可以在单行中存在注释，同时也可以多行一起注释，单行注释完整语法如下： !--这里放注释-- 在一行中，在尖括号中放置感叹号“！”和两个“-”，接下来放置注释内容，最后一定要结束注释，结束注释用两个“-”和另一个尖括号组成，即上面代码表示