第3章 字体标记.pptVIP

第3章 字体标记 字体标记在网页中常常会用到，如一个标题字体需要设置特大字体且颜色是红色、字体类别使用宋体、楷体等。在HTML中有其字体标记，用来修饰文字字体方面属性，使文字显得更丰富。本章所学习的正好是应用非常广的字体，将要学习本本章前，会学习以下方面内容： 设置字体大小 字体颜色 设置标题字体 物理字体 逻辑字体 字体实例手把手 3.1 设置字体大小 字体的大小，在网页中常常可以看到，有的新闻网站为了满足不同年龄的读者浏览，有三种不同字体大小供选择，12像素、14像素和16像素，默认的都会是14像素大小。这样看起来舒服，适合大部分读者浏览，如老年人可能会选择大点的字体。现在来学习如何设置字体大小。 合理的字体大小为网页增加不少装饰，更是一种美的感受。字体的语法为： font要放的文字/font 这只是在字体上的标记，以后的学习是在font里面加一部分属性，也就达到对字体设置的效果了。现在来学习字体大小。设置字体大小的语法代码是： font size=1HTML+CSS完全自学手册/font 关键部分就是size，表示大小。等于后面的参数是有规定的，参数是从1到7的任意一个数，数越大字体也就越大。现在对字体大小从1到7编排。 3.2 设置字体颜色 通常在网页中看到的五彩缤纷的字体，有清醒一点的、有淡薄一点的，颜色搭配好了，用户从视觉上认可该网页，这样才有可能继续读下去。字体颜色的语法简单易学，是由color表示，语法形式如下： font color=””/font 标签font中的参数color后面可以接RGB颜色值，如#000000。也可以用颜色的单词表示，如red。完整实例代码，如代码3.2所示。 代码3.2 源代码\第3章\颜色值表示的二种方式.html html head title字体颜色/title /head body !—下一行表示文本文本颜色为红色-- font color=redhtml+css完全自学手册/font br !—下一行表示文本颜色为#cccccc-- font color=#cccccchtml+css完全自学手册/font /body /html 3.3 设置标题字体样式 关于标题，在前面一章中学过如何设置标题大小，但往往有时标题文字需要用颜色来表达其效果，在这里主要在前面的基础上再学习标题属性，如标题的颜色，标题大小。标题颜色和大小设置要用到标题标签h#（#代表不同大小的标题）和前面学习的字体颜色。 3.3.1 标题的字体 本节再次讲解标题h1到h6，然后在这些标题中设置不同的颜色和其他样式。标题用h#表示的，#代表数字从1-6是表示标题大小从大到小，完整语法表述如下所示。 h1设置标题h1/h1 h2设置标题h2/h2 h3设置标题h3/h3 h4设置标题h4/h4 h5设置标题h5/h5 h6设置标题h6/h6 由系统提供的标题大小只有这6种，其中h1字体最大，相应的，h6是最小的。为了体现这些字体的大小，代码3.3演示了各个标题的大小，设置标题字体只需要在标题标签内输入文字就可以了。 3.3.2 设置字体的大小和颜色 上一小节的代码显示出标题字体的大小与颜色。用标记font可以设置文本对象的大小，同时还可以对标题标记设置其大小或颜色，也可以设置标题带下划线，删除线等这些样式，代码3.4即表示在标题中设置字体的大小与颜色。 3.4 物理字体 在第2章中介绍了常用的HTML标记，这些标记也是本小节要介绍的字体标记，字体分为物理字体和逻辑字体，本小节先来介绍前者――物理字体。物理字体在工作中常会用到。尽管在前面章节介绍过部分标记，但现在还有必要罗列出来。与其他标记一起比较，从而达到更高的学习效率。 以下是所有物理字体列表，中间的省略符代码放置的文本内容，通过标记对修饰，后面的文字说明其功能。 B…/B，将字符设置成粗体。 I…/I，将字符设置成斜体。 U…/U，给字符增加下划线。 S…/S，给字符增加删除线。 TT…/TT，将字符设置成打字机字体。 SUP…/SUP，将字符设置成上标字体。 SUB…/SUB，将字符设置成下标字体。 3.5 逻辑字体 双标记对的逻辑字体和物理字体很相似，都是由标记对组成的，但它们所体现的重点不同，逻辑字体所显示出来的更有美观感。 接下来一一介绍更有意思的逻辑字体，这可能很少见到，但作用很大。如在网页上表现代码形式的字符等。先看一下code，语法形式如下： code代码/code 说明：语法先大概了解，实例会在下一章讲解。 以下是所有物理字体列表，中间的省略符代码放置的文本内容，通过标记对修饰，后面的文字说明其功能。 EM…/EM强调文字。 STRONG…/STRONG字体加重。 CODE…/CODE显示编程代码。 SAMP…/S