作者：王英英

出版社：清华大学出版社

格式: AZW3, DOCX, EPUB, MOBI, PDF, TXT

精通HTML5+CSS3+JavaScript网页设计(视频教学版)(第2版)试读：

图书在版编目（CIP）数据

精通HTML5+CSS3+JavaScript网页设计：视频教学版／王英英编著．—2版．—北京：清华大学出版社，2019（Web前端技术丛书）

ISBN 978-7-302-52334-5

Ⅰ. ①精…　Ⅱ. ①王…　Ⅲ. ①超文本标记语言－程序设计②网页制作工具③JAVA语言－程序设计　Ⅳ. ①TP312.8②TP393.092.2

中国版本图书馆CIP数据核字（2019）第029082号责任编辑：夏毓彦封面设计：王　翔责任校对：闫秀华责任印制：出版发行：清华大学出版社网　　址：http://www.tup.com.cn，http://www.wqbook.com地　　址：北京清华大学学研大厦A座邮　　编：100084社总机：010-62770175邮　　购：010-62786544投稿与读者服务：010-62776969，c-service@tup.tsinghua.edu.cn质量反馈：010-62772015，zhiliang@tup.tsinghua.edu.cn印装者：经　　销：全国新华书店开　　本：190mm×260mm印　　张：30.5字　　数：781千字版　　次：2019年4月第1版印　　次：2019年4月第1次印刷定　　价：89.00元产品编号：080577-01内容简介

HTML5、CSS3和JavaScript技术是网页设计的精髓，本书以应用实例和综合实战案例的形式逐一详解HTML5网页设计的文档结构、文本、图像、用HTML5创建超链接、表格、使用表单；用CSS3设置表格和表单的样式、美化图片、背景和边框；讲述JavaScript内置对象、对象编程、JavaScript操纵CSS3、HTML5绘制图形、HTML5中的音频和视频、使用jQuery Mobile设计移动页面等网页设计的方法和技巧。

通过对本书实例和综合实战案例的学习与演练，读者可以尽快掌握所学的知识，提高网页设计的实战能力；同时本书提供实例源代码，可供读者直接查看和调用，以便快速上手或进行二次开发。

本书内容丰富、理论结合实践，对从事网站美工工作的读者而言，是一本必不可少的工具书；对从事Web系统开发的读者来说，也是一本难得的参考手册。前　言

HTML5+CSS3+JavaScript技术具有布局标准和样式精美的特点，成为Web 2.0众多技术中最受欢迎的网页设计技术。HTML5+CSS3+JavaScript技术的应用范围越来越广，例如门户网站、BBS、博客、在线影视等。HTML5、CSS3和JavaScript三者的结合，使网页样式布局和美化达到了一个不可思议的高度。引领读者快速学习和掌握新的设计模式是本书的初衷。本书内容

第1章是HTML5快速入门，包括HTML5的基本概念、HTML5网页文档结构、HTML5文件的编写方法和HTML5语法的新变化。

第2章介绍HTML5网页中的文本和图像，包括添加文本、文本排版、文字列表和网页中的图像等。

第3章介绍用HTML5建立超链接，包括URL的概念、超链接标记、创建热点区域和浮动框架iframe等。

第4章介绍用HTML5创建表格，包括表格基本结构及操作、完整的表格标记和制作计算机标价表等。

第5章介绍使用表单，包括表单概述、表单基本元素的使用和表单高级元素的使用等。

第6章是CSS3概述，包括CSS3基本概念、编写与浏览CSS3，以及在HTML5中使用CSS3的方法。

第7章介绍CSS3中文字与段落属性，主要包括字体属性、文本高级样式和段落属性。最后通过两个综合实例，进一步讲述如何设置公司标题和旅游网页混排的方法和技巧。

第8章介绍用CSS3设置表格和表单的样式，包括表格基本样式和CSS3与表单，并通过5个综合实例进一步讲述表单和表格样式的制作方法和技巧。

第9章介绍CSS3美化图片，主要包括图片样式、图片的对齐和图文混排等。

第10章介绍CSS3美化背景与边框，主要包括背景相关属性、边框、圆角边框、图像边框和边距，最后通过1个综合实例进一步讲述如何制作圆角边框效果。

第11章是JavaScript概述，包括JavaScript简介、在HTML5文件中使用JavaScript代码等。

第12章介绍JavaScript语言基础，包括数据类型与变量、运算符与表达式、流程控制语句和函数等。

第13章介绍JavaScript内置对象，包括字符串对象、数学对象、日期对象和数组对象等。

第14章介绍JavaScript对象编程，包括文档对象模型、窗口对象、文档对象和表单对象等。

第15章介绍JavaScript操纵CSS3，包括DHTML简介、前台动态网页效果、JS控制表单背景色、文字提示和实现即时验证效果等。

第16章介绍HTML5绘制图形，包括canvas概述、绘制基本形状、绘制渐变图形、绘制变形图形、图形组合、绘制带阴影的图形、使用图像、绘制文字和图形的保存和恢复等。

第17章介绍在HTML5中的音频和视频，包括

第18章介绍地理定位和离线Web应用，包括地理定位、离线Web应用和Web存储技术。

第19章介绍使用jQuery Mobile设计移动页面，包括jQuery Mobile概述、跨平台移动设备网页、jQuery Mobile网页的架构、使用UI组件、导航条、使用jQuery Mobile主题、创建多页面的jQuery Mobile网页、制作对话框效果、绚丽多彩的页面切换效果。

第20章介绍企业门户型网站的综合实战案例。

第21章介绍在线游戏类网站的综合实战案例。

第22章介绍手机移动类网站的综合实战案例。本书特色

知识全面：知识由浅入深，涵盖所有HTML5、CSS3和JavaScript知识点，便于读者循序渐进地掌握HTML5 +CSS3+JavaScript网页布局技术。

图文并茂：注重操作，图文并茂，在介绍案例的过程中，每一个操作均有对应的插图。这种图文结合的方式使读者在学习过程中能够直观、清晰地看到操作的过程以及效果，便于更快地理解和掌握。

易学易用：颠覆传统“看”书的观念，变成一本能“操作”的图书。

案例丰富：把知识点融汇于系统的案例实训当中，并且结合经典案例进行讲解和拓展，进而达到“知其然，并知其所以然”的效果。

贴心周到：本书对读者在学习过程中可能会遇到的疑难问题以“提示”和“技巧”的形式进行了说明，以免读者在学习的过程中走弯路。

代码支持：本书提供实例和综合实战案例的源代码，可让读者在实战应用中掌握网页布局的每一项技能，真正体现“自学无忧”，是一本物超所值的好书。

技术支持：读者可加入QQ群941230971，索要源代码、教学幻灯片和精品教学视频，讨论相关问题。读者对象

本书是一本完整介绍HTML5+CSS3+JavaScript网页制作技术的教程，内容丰富，条理清晰，实用性强，适合如下读者学习使用：● 　对网页制作有兴趣的读者，可以快速上手制作精美网页。● 　对从事美工工作的读者，是必不可少的工具书。源码、课件与教学视频下载

本书源码课件与教学视频下载地址请扫描右边二维码获取。如果下载有问题，请联系booksaga@163.com，邮件主题为“精通H5C3JS”。鸣谢

本书由王英英编著，参与编写的还有贾文学、肖品、胡霞、贺盼盼、胡秀芳、郑玉超、纪克新、唐跃爱、李爱玲、郭红侠、李茂有、贺金刚、李鑫、郭红梅、马继梅、郑思贤、贾福运、贺单单、王二帅、郭红民、张工厂、邓爱玲、谢德胜、李友洪、郭推、申小相、覃达朝、张开保、陈敏敏、庞世芳、陈莹莹、贺积回、贺咸阳、李爱勤、许金花、张国年、王永超、刘增杰、李小威、张桐嘉、杨翔艳等。本书虽然倾注了编者的心血，但由于水平有限，书中难免有疏漏之处，敬请谅解。如果遇到问题或有意见和建议，请与我们联系，我们将全力提供帮助，技术支持QQ群：941230971。编　者2019年2月第1章　HTML5快速入门

目前网络已经成为人们生活、工作中不可缺少的一部分，网页设计也成为学习计算机的重要内容之一。制作网页可采用可视化编辑软件，但是无论采用哪一种网页编辑软件，最后都是将所设计的网页转化为HTML。HTML是网页的基础语言，因此本章就来介绍HTML的基本概念、编写方法及浏览HTML文件的方法，使读者初步了解HTML，从而为后面的学习打下基础。1.1　HTML5概述

因特网上的信息是以网页的形式展示给用户的，因此网页是网络信息传递的载体。网页文件是用一种标记语言书写的，这种语言称为HTML（Hyper Text Markup Language，超文本标记语言）。

HTML是一种标记语言，而不是一种编程语言，主要用于描述超文本中内容的显示方式。标记语言从诞生到今天，经历了二十几载，发展过程中也有很多曲折，经历的版本及发布日期如表1-1所示。表1-1　HTML经历的版本

HTML是一种标记语言，经过浏览器的解释和编译，虽然本身不能显示在浏览器中，但是在浏览器中可以正确显示HTML标记的内容。HTML语言从1.0至5.0经历了巨大的变化，从单一的文本显示功能到图文并茂的多媒体显示功能，许多特性经过多年的完善，已经成为一种非常完善的标记语言。尤其是HTML5，对多媒体的支持功能更强，它新增功能如下：● 新增语义化标记，使文档结构明确● 新的文档对象模型（DOM）● 实现2D绘图的canvas对象● 可控媒体播放● 离线存储● 文档编辑● 拖放● 跨文档消息● 浏览器历史管理● MIME类型和协议注册

对于这些新功能，支持HTML5的浏览器在处理HTML代码错误的时候会更灵活，而那些不支持HTML5的浏览器将忽略HTML5代码。

HTML5不是一种编程语言，而是一种描述性的标记语言，用于描述超文本中的内容和结构。HTML最基本的语法是<标记符>。标记符通常都是成对使用，有一个开头标记和一个结束标记。结束标记只是在开头标记的前面加一个斜杠“/”。当浏览器收到HTML文件后，就会解释里面的标记符，然后把标记符相对应的功能表达出来。

如在HTML中用

HTML5文档最基本的结构主要包括文档类型说明、文档开始标记、元信息、主体标记和页面注释标记。1.2.1　文档类型说明

HTML5设计准则中最重要的一条是化繁为简，Web页面的文档类型说明（Doctype）被极大地简化了。

在HTML4或早期的版本中，创建HTML文档时，文档头部的类型说明代码如下：

上面为XHTML文档类型说明，读者可以看到这段代码既麻烦又难记，HTML5对文档类型进行了简化，简单到15个字符就可以了，代码如下： 技巧提示Doctype声明需要出现在HTML文件的第一行。1.2.2　HTML标记

HTML标记代表文档的开始，由于HTML语言语法的松散特性，该标记可以省略，但是为了使之符合Web标准和文档的完整性，用户要养成良好的编写习惯，建议不要省略该标记。

HTML标记以开头，以结尾，文档的所有内容书写在开头和结尾的中间部分。语法格式如下： … 1.2.3　头标记head

头标记head用于说明文档头部相关信息，一般包括标题信息、元信息、定义CSS样式和脚本代码等。HTML的头部信息是以开始，以结束，语法格式如下： … 技巧提示元素的作用范围是整篇文档，定义在HTML文档头部的内容往往不会在网页上直接显示。1. 标题标记title

HTML页面的标题一般用来说明页面的用途，显示在浏览器的标题栏中。在HTML文档中，标题信息设置在与之间。标题标记以结束，语法格式如下：

在标记中间的“…”就是标题的内容，可以帮助用户更好地识别页面。预览网页时，设置的标题在浏览器的左上方标题栏中显示（如图1-1所示）。页面的标题只有一个，在HTML文档的头部，即和之间。图1-1　标题栏在浏览器中的显示效果2. 元信息标记meta

标记可提供有关页面的元信息（meta-information），比如针对搜索引擎和更新频度的描述和关键词。

标记位于文档的头部，不包含任何内容。标记的属性定义了与文档相关联的名称／值，标记提供的属性及取值见表1-2。表1-2　标记提供的属性及取值（1）字符集charset属性

在HTML5中，有一个新的charset属性，使字符集的定义更加容易。例如，下列代码告诉浏览器，网页使用“ISO-8859-1”字符集显示，代码如下所示。 （2）搜索引擎的关键字

早期，meta keywords关键字对搜索引擎的排名算法起到一定的作用，是很多人进行网页优化的基础。关键字在浏览时是看不到的，使用格式如下。

说明：● 不同的关键字之间，应用半角逗号隔开（英文输入状态下），不要使用“空格”或“|”间隔。● 是keywords，不是keyword。● 关键字标签中的内容应该是一个个的短语，而不是一段话。

例如，定义针对搜索引擎的关键词，代码如下：

关键字标记keywords，曾经是搜索引擎排名中很重要的因素，但现在已经被很多搜索引擎完全忽略。加上这个标记对网页的综合表现没有坏处，不过如果使用不恰当，对网页非但没有好处，还有欺诈的嫌疑。在使用关键字标记keywords时，要注意以下几点：● 关键字标记中的内容要与网页核心内容相关，确信使用的关键字字出现在网页文本中。● 使用用户易于通过搜索引擎检索的关键字，过于生僻的词汇不太适合做meta标记中的关键字。● 不要重复使用关键字，否则可能会被搜索引擎惩罚。● 一个网页的关键字标记里最多包含5个重要的关键字，不要超过5个。● 每个网页的关键字应该不一样。技巧提示由于设计者或SEO优化者以前对meta keywords关键字的滥用，导致目前它在搜索引擎排名中的作用很小。（3）页面描述

meta description（描述元标记）是一种HTML元标记，用来简略描述网页的主要内容，通常被搜索引擎用于搜索结果页上展示给最终用户看的一段文字片段。页面描述在网页中是不显示出来的，使用格式如下：

例如，定义对页面的描述，代码如下： （4）页面定时跳转

使用标记可以使网页在经过一定时间后自动刷新，这可通过将http-equiv属性值设置为refresh来实现。content属性值可以设置为更新时间。

在浏览网页时经常会看到一些欢迎信息的页面，在经过一段时间后，这些页面会自动转到其他页面，这就是网页的跳转。页面定时刷新跳转的语法格式如下：

说明：上面的“[url=网址]”部分是可选项。如果有这部分，页面定时刷新并跳转；如果省略该部分，页面只定时刷新，不进行跳转。

例如，实现每5秒刷新一次页面，将下述代码放入head标记部分即可。 1.2.4　网页的主体标记body

网页所要显示的内容都放在网页的主体标记内，是HTML文件的重点所在，后面章节所要介绍的HTML标记都将放在这个标记内。然而它并不仅仅是一个形式上的标记，它本身也可以控制网页的背景颜色或背景图像，这会在后面进行介绍。主体标记以开始、以结束，语法格式如下： …

注意，在构建HTML结构时，标记不允许交叉出现，否则会造成错误。

例如，在下列代码中，开始标记出现在标记内。

代码中的第4行开始标记和第5行的

注释是在HTML代码中插入的描述性文本，用来解释该代码或提示其他信息。注释只出现在代码中，浏览器对注释代码不进行解释，并且在浏览器的页面中不显示。在HTML源代码中适当地插入注释语句是一种非常好的习惯。对于设计者日后的代码修改、维护工作很有好处。另外，如果将代码交给其他设计者，其他人也能很快读懂前者所撰写的内容。

语法格式如下：

注释语句元素由前后两半部分组成，前半部分一个左尖括号、一个半角感叹号和两个连字符，后半部分由两个连字符和一个右尖括号组成。

HTML5从入门到精通

页面注释不但可以对HTML中一行或多行代码进行解释说明，而且可以注释掉这些代码。如果希望某些HTML代码在浏览器中不显示，可以将这部分内容放在之间。例如，修改上述代码，如下所示：

修改后的代码，将

标记作为注释内容处理，在浏览器中将不会显示。1.3　HTML5文件的编写方法

有两种方式来产生HTML文件：一种是自己写HTML文件，事实上这并不是很困难，也不需要特别的技巧；另一种是使用HTML编辑器，它可以辅助使用者来做编写的工作。1.3.1　使用记事本手工编写HTML文件

前面介绍到HTML5是一种标记语言（标记语言代码是以文本形式存在的），因此所有的记事本工具都可以作为它的开发环境。HTML文件的扩展名为.html或.htm，将HTML源代码输入到记事本并保存之后，可以在浏览器中打开文档以查看其效果。

使用记事本编写HTML文件，具体操作步骤如下：

01　单击Windows桌面上的【开始】按钮，选择【所有程序】➢【附件】➢【记事本】命令，打开一个记事本，在记事本中输入HTML代码，如图1-2所示。

02　编辑完HTML文件后，选择【文件】➢【保存】命令或按Ctrl+S组合键，在弹出的【另存为】对话框中选择【保存类型】为【所有文件】，然后将文件扩展名设为.html或.htm，如图1-3所示。图1-2　编辑HTML代码图1-3　【另存为】对话框

03　单击【保存】按钮，保存文件。打开网页文档，在IE浏览器中预览效果，如图1-4所示。图1-4　网页的浏览效果1.3.2　使用Dreamweaver CC编写HTML文件

常言道：“工欲善其事，必先利其器”。虽然使用记事本可以编写HTML文件，但是编写效率太低，对于语法错误及格式都没有提示，因此，可以使用专门编写HTML网页的工具来弥补这种缺陷。Adobe公司的Dreamweaver CC用户界面非常友好，是一个非常优秀的网页开发工具，深受广大用户的喜爱。

使用Dreamweaver CC编写HTML文件，具体操作步骤如下：

01　启动Dreamweaver CC（如图1-5所示），在欢迎屏幕的【新建】栏中选择HTML选项，或者单击菜单中的【文件】➢【新建】命令（快捷键Ctrl+N）。

02　弹出【新建文档】对话框（如图1-6所示），在【页面类型】选项区中选择HTML选项，在【文档类型】中选择【HTML 5】选项。图1-5　包含欢迎屏幕的主界面图1-6　【文档类型】对话框

03　单击【创建】按钮，创建HTML文件，如图1-7所示。

04　在文档工具栏中，单击【代码】按钮，切换到代码视图，如图1-8所示。图1-7　设计视图下显示创建的文件图1-8　代码视图下显示创建的文件

05　修改HTML文件标题，将代码中

06　在标记中输入“溪上平岗千叠翠，万树亭亭，争作拏云势。”，完整HTML代码如下所示。 溪上平岗千叠翠，万树亭亭，争作拏云势。

07　保存文件。单击菜单中的【文件】➢【保存】命令或按Ctrl+S组合键，弹出【另存为】对话框。在对话框中，选择保存位置并输入文件名，单击【保存】按钮，如图1-9所示。

08　单击文档工具栏中的图标，选择查看网页的浏览器，或按下功能键F12使用默认浏览器查看网页，预览效果如图1-10所示。图1-9　保存文件图1-10　浏览器预览效果1.4　HTML5语法的新变化

为了兼容各个不统一的页面代码，HTML5的设计在语法方面做了以下变化。1.4.1　标签不再区分大小写

标签不再区分大小写是HTML5语法变化的重要体现，例如： 人到情多情转薄，而今真个不多情。

在IE 11.0浏览器中预览，效果如图1-11所示。图1-11　网页预览效果

虽然“人到情多情转薄，而今真个不多情。”中开始标记和结束标记不匹配，但是这完全符合HTML5的规范。用户可以通过W3C提供的在线验证页面来测试上面的网页，验证网址为http://validator.w3.org/。1.4.2　允许属性值不使用引号

在HTML5中，属性值不放在引号中也是正确的。例如以下代码片段：

上述代码片段与下面的代码片段效果是一样的：

注意：虽然HTML5允许属性值可以不使用引号，但是仍然建议读者加上引号。因为如果某个属性的属性值中包含空格等容易引起混淆的属性值，此时可能会引起浏览器的误解。例如以下代码：

此时浏览器就会误以为src属性的值就是ss，这样就无法解析路径中的1.1.jpg图片。如果想正确解析到图片的位置，只有添加上引号。1.4.3　允许部分属性值的属性省略

在HTML5中，部分标志性属性的属性值可以省略。例如，以下代码是完全符合HTML5规则的：

其中，checked="checked"省略为checked，而readonly="readonly"省略为readonly。

在HTML5中，可以省略属性值的属性如表1-3所示。表1-3　可以省略属性值的属性1.5　专家解惑

问题1：如何理解HTML5中的单标记和双标记书写方法？

HTML5中的标记分为单标记和双标记。所谓单标记是指没有结束标记的标记，双标记是指既有开始标记又包含结束标记。

对于不允许写结束标记的单标记元素，只可以使用“<元素/>”的形式进行书写。例如“
…”的书写方式是错误的，正确的书写方式为
。当然，在HTML5之前的版本中
这种书写方法可以被沿用。HTML5中不允许写结束标记的元素有area、base、br、col、command、embed、hr、img、input、keygen、link、meta、param、source、track、wbr。

对于部分双标记可以省略结束标记。HTML5中允许省略结束标记的元素有li、dt、dd、p、rt、rp、optgroup、option、colgroup、thead、tbody、tfoot、tr、td、th。

HTML5中有些元素还可以完全被省略标记，即使这些标记被省略了，该元素还是以隐式的方式存在的。HTML5中允许省略全部标记的元素有html、head、body、colgroup、tbody。

问题2：为何使用记事本编辑HTML文件无法在浏览器中预览，而是直接在记事本中打开？

很多初学者，保存文件时，没有将HTML文件的扩展名.html或.htm作为文件的后缀，导致文件还是以.txt为扩展名，因此无法在浏览器中查看。如果读者是通过右击，创建记事本文件，那么在给文件重命名时一定要以html或.htm作为文件的后缀。特别要注意的是当Windows系统的扩展名隐藏时，更容易出现这样的错误。读者可以在【文件夹选项】对话框中设置是否显示扩展名。

问题3：在网页中，语言的编码方式有哪些？

在HTML5网页中，标记的charset属性用于设置网页的内码语系，也就是字符集的类型。国内常用的是GB码，由于经常要显示汉字，因此通常设置为“GB2312”（简体中文）和“UTF-8”两种。英文是“ISO-8859-1”字符集。此外还有其他的字符集，这里不再介绍。第2章　HTML5网页中的文本和图像

文字和图像是网页中最主要也是最常用的元素。这一章将开始讲解如何在网页中使用文字、文字结构标记以及图像的方法。2.1　添加文本

网页中的文本可以分为两大类：一类是普通文本，另一类是特殊字符文本。2.1.1　普通文本

所谓普通文本是指汉字或者在键盘上可以输出的字符。读者可以在Dreamweaver CC代码视图的标记部分直接输入，或者在设计视图下直接输入。

如果有现成的文本，可以使用复制的方法把其他窗口中需要的文本复制过来。在粘贴文本的时候，如果只希望把文字粘贴过来，而不需要粘贴文档中的格式，可以使用Dreamweaver CC的“选择性粘贴”功能。“选择性粘贴”功能只在Dreamweaver CC的设计视图中起作用，因为在代码视图中粘贴的仅文本，不会有格式。例如，将Word文档表格中的文字复制到网页中，而不需要表格结构，其操作方法为选择【编辑】➢【选择性粘贴】选项或按下快捷键Shift+Ctrl+V，弹出【选择性粘贴】对话框，在对话框中选中【仅文本】单选按钮即可，如图2-1所示。图2-1　【选择性粘贴】对话框2.1.2　特殊文字符号

目前，很多行业上的信息都出现在网络上，每个行业都有自己的行业特性，如数学、物理和化学都有特殊的符号。如何在网页上显示这些特殊字符是本节将要讲述的内容。

在HTML中，特殊字符以“&”开头，以“；”结尾，中间为相关字符编码。例如，大括号和小括号被用于声明标记，因此如果在HTML代码中出现“<”和“>”符号，就不能直接输入了，需要当作特殊字符处理。在HTML中，用“<”代表符号“<”，用“>”代表符号“>”。例如，输入公式"a>b"，在HTML中需要表示为“a>b”。

HTML中还有大量这样的字符，例如空格、版权等，常用特殊字符如表2-1所示。表2-1　常用特殊字符

在编辑化学公式或物理公式时，使用特殊字符的频度非常高。如果每次输入时都去查询或者要记忆这些特殊特号的编码，工作量是相当大的，在此为读者提供以下技巧：（1）在Dreamweaver CC的设计视图下输入字符，如输入a>b这样的表达式，可以直接输入。对于部分键盘上没有的字符可以借助“中文输入法”的软键盘。在中文输入法的软键盘上单击鼠标右键，弹出特殊类别项（如图2-2所示），选择所需类型，如选择“数学符号”，弹出数学相关符号（如图2-3所示），单击相应按钮即可输入。图2-2　特殊符号分类图2-3　数学符号（2）文字与文字之间的空格如果超过一个，那么从第2个空格开始都会被忽略掉。快捷地输入空格的方法如下：将输入法切换成“中文输入法”，并置于“全角”（Shift+空格）状态，直接击键盘上的空格键即可。（3）对于上述两种方法都无法实现的字符，可以使用Dreamweaver CC的【插入】菜单实现。选择【插入】➢HTML➢【特殊字符】菜单命令，在所需要的字符中选择，如果没有所需要的字符，就选择【其他字符】选项。技巧提示尽量不要使用多个“ ”来表示多个空格，因为多数浏览器对空格的距离的实现是不一样的。2.1.3　文本特殊样式

在文档中经常会出现重要文本（加粗显示）、倾斜文本、上标和下标文本等。1. 重要文本

重要文本通常以粗体显示、强调方式显示或加强调方式显示。HTML中的标记、标记和标记分别用来实现这三种显示方式。【例2.1】（实例文件：ch02\2.1.html）

在IE 11.0中预览，效果如图2-4所示，实现了文本的三种显示方式。图2-4　重要文本预览效果2. 倾斜文本

HTML中的标记实现了文本的倾斜显示。放在之间的文本将以斜体显示。【例2.2】（实例文件：ch02\2.2.html）

在IE 11.0中预览，效果如图2-5所示，其中文字以斜体显示。图2-5　倾斜文本预览效果技巧提示HTML中的重要文本和倾斜文本标记已经过时，是需要读者忘记的标记，这些标记都应该使用CSS样式来实现。随着后面学习的深入，读者会逐渐发现，即使HTML和CSS实现相同的效果，但是CSS所能实现的控制远远比HTML要细致、精确得多。3. 上标和下标文本

在HTML中用^{标记实现上标文字，用_{标记实现下标文字。和都是双标记，放在开始标记和结束标记之间的文本会分别以上标或下标形式出现。【例2.3】（实例文件：ch02\2.3.html）}}

试读结束[说明：试读内容隐藏了图片]

下载完整电子书