Web前端开发案例教程（HTML5+CSS3） 第1章 WEB前端开发概述.pptxVIP

第1章 WEB前端开发概述 认识WEB前端开发 WEB相关概念 HTML5概述 常用的浏览器介绍 创建第一个HTML5页面 1.1认识WEB前端开发 2 第1章 WEB前端开发概述 3 WEB前端开发主要是指利用HTML5、CSS3、JavaScript和JQuery等各种WEB技术进行客户端产品的开发。完成客户端程序(也就是浏览器端)的开发，同时结合后台开发技术模拟整体效果，进行丰富互联网的WEB开发，致力于通过技术改善用户体验。 与前端开发对应的是后端开发，如果只做WEB前端的话，则只能供用户浏览而不能与服务器交互。因此，要想开发一个用户体验更好、功能更强大的网站，我们就有必要去学习一些后端技术。譬如PHP、JSP和ASP.NET等这些开发技术，通过这些编程工具的使用，结合后台数据库技术，可以使网站具有后台存储和处理数据等功能。 本书是学习WEB前端开发技术的教材，主要学习利用HTML5和CSS3构建WEB网页的知识。 1.2 WEB相关概念 4 第1章 WEB前端开发概述 IP 地址的格式是 xxx.xxx.xxx.xxx，其中 xxx 是 0 到 255 之间的任意整数。 例如，某台主机的 IP 地址是 32。 5 IP地址(Internet Protocol Address)用于确定Internet上的每台主机，它是每台主机唯一性的标识。在 Internet 上，每台计算机或网络设备的 IP 地址是全世界唯一的。 6 由于IP地址是数字编码，不易记忆，所以我们平时上网所使用的大多是诸如之类的地址，即域名地址。www表示的是万维网。 例如， 是山东信息职业技术学院的域名。 7 URL是Uniform Resource Locator的缩写，中文译为“统一资源定位符”，其实就是WEB地址，俗称“网址”。在WWW上的所有文件都有唯一的URL，只要知道资源的URL，就能够对其访问。 URL格式：协议名：//主机域名或IP地址/路径/文件名称 例如，/xxyw/index.html就是山东信息职业技术学院网站新闻中心页的URL地址。 8 HTTP是HyperText Transfer Protocol的缩写，中文译为“超文本传输协议”。 超文本传输协议(HyperText Transfer Protocol)是互联网上应用最为广泛的一种网络协议。所有的WWW文件都必须遵守这个标准。设计HTTP最初的目的是为了提供一种发布和接收HTML页面的方法。 9 在浏览网站时看到的每个页面像是书中的一页，我们称之为“网页”。 把一系列逻辑上可以视为一个整体的网页叫网站。 主页是网站在WWW上开始的页面，其中包含指向其他页面的超链接。通常用index.htm或index.html表示。 10 HTML是Hyper Text Markup Language的缩写，中文译为“超文本标记语言”。 是表示网页的一种规范（或者说是一种标准），它通过标记符定义了网页内容的显示。HTML提供了许多标记，如段落标记、标题标记、超链接标记和图片标记等。网页中需要显示什么内容，就用相应的HTML标记进行描述。 11 图1-1　网页的HTML源代码 12 WEB标准并不是一个某一个标准，而是一系列标准的集合，主要包括结构标准、表现标准和行为标准。结构主要指的是网页的HTML结构，即网页文档的内容；表现指的是网页元素的版式、颜色、大小等外观样式，主要指CSS（Cascading Style Sheet），即层叠样式表；行为是指网页模型的定义及交互代码的编写，主要是用JavaScript脚本语言实现的网页行为效果。 13 WEB相关概念 1 3 6 5 4 HTTP 网站、网页与主页 HTML 域名 IP地址 7 2 URL Web标准 1.3 HTML5概述 14 第1章 WEB前端开发概述 15 HTML5是超文本标记语言的第5代版本，目前在互联网的应用越来越普及。HTML5将WEB应用带入一个标准的应用平台。在HTML5平台上，视频、音频、图像和动画等都被标准化。 16 HTML5的主要优势如下： 良好的移植性。 摒弃过时标记。 更直观的结构。 内容和样式的分离。 新的表单元素。 更方便地嵌入音频和视频。 矢量图绘制。 17 浏览器是网页运行的平台，网页文件必须要使用浏览器打开才能看到网页所呈现的效果。目前，常用的浏览器有IE、Firefox（火狐）、Chrome（谷歌）、Safari和Opera等。 18 IE浏览器是世界上使用最广泛的浏览器，它由微软公司开发，预装在windows操作系统中。所以我们装完windows系统之后就会有IE浏览器。IE从9.0版本