图1.19 保存成.html文件
（3）点击“在浏览器中预览/调试”按钮，选择chrome.exe浏览器进行预览。或者通过双击.html文件进行预览。如图1.20所示。
图1.20 在Chrome浏览器中预览效果
到此本教材的第一个网页就运行成功了，可以试着改变<title>和<body>中的内容。然后重新保存页面并刷新浏览器进行预览。
1.3.4 HTML注释
在编写HTML代码时，经常要在一些关键代码旁做一下注释，这样做的好处很多，如：方便理解代码、方便查找相关代码或是方便项目组里的其他程序员来了解你所写的代码，还可以方便自己以后对代码的理解和修改。语法格式如下：
<!--注释的内容-->
“<!--”表示注释的开始，“-->”表示注释的结束。DW中自带添加注释功能，如图1.21所示，也可手动添加注释。
图1.21 HTML注释
1.3.5 HTML属性
使用HTML制作网页时，如果想让网页的内容更丰富，如设置显示文字的颜色为彩色，大小为30。此时如果仅仅使用HTML标签默认显示样式已经不能满足需求，就需要对HTML标签的属性加以设置，大多数标签都有自己的一些属性, 属性要写在始标签内，属性用于进一步改变显示的效果, 各属性之间无先后次序，可以省略而采用默认值;其语法格式如下：
<标签名字 属性1 属性2 属性3 … >内容</标签名字>
在语法格式中，标签可以有多个属性，必须写在开始标签中，位于标签名之后。属性与标签之前需要一个空格隔开，多个属性之间也用空格隔开。
作为一般的原则，大多数属性值不用加双引号。但是包括空格、“％”，“＃”等特殊字符的属性值必须加入双引号。为了好的习惯，提倡全部对属性值加双引号。如：
<font color="#ff00ff" face="宋体" size="30">字体设置</font>
注意：一定不要在“<”与标签名之间输入多余的空格，也不能在中文状态下输入这些标签及属性，否则浏览器不能正确的识别括号中的标志命令，从而无法正确的显示信息。后面还会学习到更多其他的HTML属性，这里读者只要记住HTML属性的基本格式就好。
1.4 本章小结
通过本章的学习，初步了解了Web前端技术和相关行业信息。学习到Web前端开发工具的使用，而且还运行了第一个HTML语言的网页程序。本章中需要理解什么是HTML语言，HTML语言的基本格式，HTML语言的属性设置等相关知识点。在下一章节中，将进一步来学习HTML这门语言。
1.5 习题
a) 填空题
(1) Web前端开发所包括的三大核心技术包含 、 、JavaScript语言。
(2) 超文本标记语言指的是 。
(3) HTML文档包括 和 两部分。
(4) HTML多个属性之间分隔用 。
(5) 用于向浏览器说明当前文档属于哪种HTML或XHTML标准规范。
b) 选择题
(1) 下列选项中，不属于网站开发四大职位的是（ ）。
A．web前端开发工程师 B．数据库开发工程师
C．测试开发工程师 D．web后端开发工程师
(2) 下面哪个不属于HTML基本结构（ ）。
A．<meta> B．<head>
C．<body> D．<html>
(3) 下面哪个不属于五大浏览器（ ）。
A．Firefox浏览器 B．Chrome浏览器
C．Safari浏览器 D．360浏览器
(4) 下面哪个标签限定了文档的开始点和结束点（ ）。
A．<! DOCTYPE > B．<html>
C．<head> D．<body>
(5) 下面用来定义文档标题的标签是（ ）。
A．<style> B．<link>
C．<script> D．<title>
c) 思考题
(1) 请简述什么是超文本标记语言？
(2) 请简述HTML、CSS、JS三者的关系及职能划分？
观看视频 ：782542147
内容来源书籍：《HTML5从入门到精通》，一本Web前端实用性综合技术图书。
简介： 《HTML5从入门到精通》倡导“快乐学习，实战就业”的理念，作为初学者高品质的入门教材之一，免费提供一站式教学服务包，附赠配套PPT、教学视频、教学大纲、考试系统、测试题等资源。且书本内容覆盖全面、讲解详细，其中包括标签语义化、标签使用规范、选择器类型、盒模型、标签分类、样式重置、CSS优化、Photoshop切图处理、整页制作、CSS3新样式、HTML5新功能等。与此同时，本教材通过总结、归纳HTML、CSS、CSS3动画与3D及移动端布局与响应式开发等核心知识点，并从项目开发的实际需求入手，将理论知识与实际应用相结合，以此帮助初学者全面、系统、深入、透彻地理解HTML5的基础知识和技术，使他们快速地成长为初级程序员，并拥有一定的项目开发经验，从而在职场中拥有一个较高的起点。
