《HTML5+CSS3网页设计入门必读》——第6章处理字体6.1 处理特殊字符

第6章处理字体

在本章中你将学到：

怎样使用特殊字符；
怎样使用粗体字、斜体和特殊文本格式化效果；
怎样使用文本效果；
怎样调整字体；
怎样使用Web字体。

在Web的早期时代，只以一种字体和一种大小显示文本，但是那些日子已经一去不复返了。HTML与CSS的组合使得有可能控制文本外观的所有方面。在本章中，你将学习如何更改字体的视觉显示（它的字体系列、大小和粗细），以及如何把粗体字、斜体字、上标、下标和加删除线的文本纳入到页面中。你还将学习如何更改字形和字体大小。

Try It Yourself：准备示例文本

如果你具有一些可以显示不同字体和颜色并且可以缩进、居中显示或者执行其他操作的示例文本，那么在这一整章中，就可以最大限度地学习如何编排文本样式。它实际上与你将使用的文本类型无关，因为你具有如此多种不同的样式可能性要尝试，以至于它们无论如何都永远不会同时出现在相同的Web页面上（除非你想使访问者陷入疯狂之中）。利用这个机会，感受一下文本级改变可能如何影响内容的外观。

如果你将使用的文本来自字处理或数据库程序，一定要把它以纯文本或ASCII格式保存到一个新文件中。然后在学习本书的过程中可以添加合适的HTML标签和样式属性来格式化它。*
任何文本都可以，但是要尽量找到（或输入）一些你想放到Web页面上的文本。公司宣传册或者你的简历中的文本可能是一个好的选择。
任何类型的大纲、演示文稿中的项目编号要点、带编号的步骤、术语表或者数据库中的文本信息的列表都是可以处理的良好材料。
在使用本章中介绍的代码格式化正文文本之前，要添加在前面各章中使用的HTML基本标签集（至少要使用、、

6.1 处理特殊字符

在我们急匆匆地介绍字体改变之前，先让我们简要讨论一下字体内的特殊字符。大多数字体都包括用于欧洲语言的特殊字符，比如Café中的重音“é”。你还将发现少量的数学符号和特殊的标点符号，比如圆形项目符号（图像说明文字）。

注意：
在查看其他设计师的Web内容时，你可能注意到其中标记文本的方法不同于本书中讲述的那些方法。一些格式化文本的老方法包括：使用标签对来指示何时应该对单词进行加粗，使用标签对指示何时应该以斜体格式显示单词，以及使用标签对指定字体系列、大小和其他属性。不过，这种方法将被HTML逐步淘汰，并且CSS要强大得多。
在HTML文档中，可以使用如表6.1所示的合适代码在任何位置插入这些特殊字符

https://yqfile.alicdn.com/3a102cb3dd2858105826767b3d14feb704039995.png" >

https://yqfile.alicdn.com/30da74cae708a52cbb5e86b51e6af1ae282545e6.png" >

例如，可以使用以下任何一种方法创建单词“café”：

caf&eacute;
café

提示：

你正在寻找版权（）和注册商标（）符号吗？它们的代码分别是和。要创建未注册的商标（）符号，可以使用。
尽管可以通过数字指定字符实体，每个符号还具有一个助记名称，它们通常更容易记住。

HTML使用称为字符实体（character entity）的特殊代码来表示诸如和之类的特殊字符。字符实体的指定总是开始于“&”，并且结束于“;”。表6.1列出了最常用的字符实体，尽管HTML支持的字符实体要多得多。

表6.1包括用于尖括号、引号以及“与”符号的代码。如果希望这些符号出现在页面上，就必须使用那些代码；否则，Web浏览器将把它们解释为HTML命令。

程序清单6.1和图6.1显示了表6.1中的几个符号的实际应用。

程序清单6.1 特殊字符代码

<!DOCTYPE html>
<html lang="en">
　<head>
　　<title>Punctuation Lines</title>
　　<style type="text/css">
　　section {
　　 margin-bottom: 20px;
　　}
　　</style>
　</head>
　<body>
　　<section>
　　　Q: What should you do when a British banker picks a fight
　　　with you?<br />
　　　A: &pound; some &cent;&cent; into him.
　　</section>
　　<section>
　　　Q: What do you call it when a judge takes part of a law
　　　off the books?<br />
　　　A: &sect; violence.
　　</section>
　　<section>
　　　Q: What did the football coach get from the locker room
　　　vending machine in the middle of the game?<br />
　　　A: A &frac14; back at &frac12; time.
　　</section>
　　<section>
　　　Q: How hot did it get when the police detective interrogated
　　　the mathematician?<br />
　　　A: x&sup3;&deg;
　　</section>
　　<section>
　　　Q: What does a punctilious plagiarist do?<br />
　　　A: &copy;
　　</section>
　</body>
</html>

https://yqfile.alicdn.com/537cf5263af72e546eadc2bf870934459bb53f40.png" >

时间： 2024-07-29 05:35:50

《HTML5+CSS3网页设计入门必读》——第6章处理字体6.1 处理特殊字符

第6章处理字体

6.1 处理特殊字符