教材-Web前端设计师成长之路-HTML部分.doc

WEB前端开发工程师成长之路（第一卷） HTML网页制作基础 作者：郝雷刚 2017.3  WEB前端开发工程师成长之路丛书系列 第一卷 HTML网页制作基础 第二卷 CSS样式表 第三卷 Javascript程序设计基础 第四卷 DOM编程基础 第五卷 DIV+CSS+HTML5 第六卷 Apache服务器配置与管理 第七卷 PHP程序设计 第八卷 MYSQL数据库设计基础 第九卷 WAMP项目实战 概述 随着互联网的迅猛发展和普及，一个新型的行业和新兴的职位正在上升到技术的层面：web前端开发工程师Web前端开发工程师，主要职责是利用(X)HTML/CSS/JavaScript/Flash等各种Web技术进行客户端产品的开发。完成客户端程序（也就是浏览器端）的开发，开发JavaScript以及Flash模块，同时结合后台开发技术模拟整体效果，进行丰富互联网的Web开发，致力于通过技术改善用户体验。除了主要职责外，Web前端开发工程师，还要为网站上提供的产品和服务实现一流的Web界面，优化代码并保持良好兼容性精通HTML/XHTML、CSS，熟悉页面架构和布局，对Web标准和标签语义化有深入理解熟悉Ajax、JavaScript(或者ActionScript)、DOM等前端技术，掌握面向对象编程思想目录 概述 3 第一章HTML初识 5 1.1HTML基础知识及基本特点。 5 1.2网页与网站的区别。 5 1.3网页的基本结构。 5 1.4 DW网页制作工具基础。 6 1.5代码书写规则。 8 1.6制作第一个网页。 8 第二章文字与图片 10 2.1文本与标题 10 2.2段落与换行 11 2.3超链接 12 2.4图片与图文混排 14 2.5背景音乐与视频 14 2.6特殊符号 15 第三章列表 17 3.1列表应用。 17 3.2有序列表。 17 3.3无序列表。 18 3.4自定义列表。 19 3.5混合列表。 19 3.6案例实操。 20 第四章表格 22 4.1表格应用。 22 4.2表格基本结构及基本属性。 23 4.3表格嵌套。 24 4.4网页布局。 27 第五章表单 35 5.1表单的应用。 35 5.2表单的工作原理。 37 5.3表单的基本结构。 37 5.4表单的基本属性。 38 5.5文本框、密码框和文本域。 39 5.6标注标签、单选按钮与复选框。 40 5.7列表框与菜单。 41 5.8按钮。 42 第一章HTML初识 目标： 什么是HTML。 网页与网站的区别。 HTML的特点。 网页的基本结构。 常用的网页制作工具。 制作第一个网页。 html是hypertext markup language的缩写，即超文本标记语言。html文件是带有格式标识符和超文本链接的内嵌代码的ascii 文本文件Web技术（如：脚本语言、公共网关接口、组件等），可以创造出功能强大的网页。因而，超级文本标记语言是万维网（Web）编程的基础，也就是说万维网是建立在超文本基础之上的。超级文本标记语言之所以称为超文本标记语言，是因为文本中包含了所谓“超级链接”点。 标准通用标记语言下的一个应用，也是一种规范，一种标准它通过标记符号来标记要显示的网页中的各个部分。网页文件本身是一种文本文件，通过在文本文件中添加标记符，可以告诉浏览器如何显示其中的内容（如：文字如何处理，画面如何安排，图片如何显示等）。浏览器按顺序阅读网页文件，然后根据标记符解释和显示其标记的内容，对书写出错的标记将不指出其错误，且不停止其解释执行过程，编制者只能通过显示效果来分析出错原因和出错部位。但需要注意的是，对于不同的浏览器，对同一标记符可能会有不完全相同的解释，因而可能会有不同的显示效果。 HTML是网络的通用语言,一种简单、通用的全置标记语言。它允许网页制作人建立文本与图片相结合的复杂页面，这些页面可以被网上任何其他人浏览到，无论使用的是什么类型的电脑或浏览器。 html网页结构包括头部 (head)、主体 (body) 两大部分。头部描述浏览器所需的信息，主体包含所要说明的具体内容。 DW”，中文名称 梦想编织者，是美国MACROMEDIA公司开发的集网页制作和管理网站于一身的所见即所得网页编辑器，DW是第一套针对专业网页设计师特别发展的视觉化网页开发工具，利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页。 文档设计、编辑栏详细说明 面板组详细说明 编辑属性区详解 HTML编辑属性： CSS编辑属性： 1.5代码书写规则。 自动规范代码，可以让整个页面的代码看起来更加有层次感。点击菜单栏 命令 应用源格式，可以自动规范代码。 HTML标签格式： HTML标签配对原则。大部分的HTML标签都是成