《HTML CSS JavaScript前端开发基础教程》全套PPT课件.pptx

第1章 HTML/CSS/JavaScript介绍 引言：HTML+CSS+JavaScript是Web开发必将涉及的三种技术，它们将网页按照网页内容、外观样式及动态效果彻底分离，从而大大减少页面代码，能节省带宽、加快页面渲染，更便于分工设计、代码重用，既易于维护，又能被移植到以后更新升级的Web程序中；同时按照Web标准能够轻松制作出能在各种终端设备中访问的页面。1.1. HTML/CSS/JavaScript介绍现代网页设计最准确的设计思路是把网页分成三个层次，即：结构层(HTML)、表示层(CSS)、行为层(JavaScript)。HTML、CSS、JavaScript简介及简单分工如下：(1). HTML即超文本标记语言（ Hyper Text Markup Language），HTML 是用来描述网页的一种语言。(2). CSS即层叠样式表（ Cascading Style Sheets），样式定义如何显示 HTML 元素，语法为：selector {property：value} (选择符 {属性：值})。(3). JavaScript是一种脚本语言，其源代码在发往客户端运行之前不需经过编译，而是将文本格式的字符代码发送给浏览器由浏览器解释运行。1.1. HTML/CSS/JavaScript介绍对于一个网页，HTML定义网页的结构，CSS描述网页的样式，JavaScript设置逻辑和动态效果。一个很经典的例子是说HTML就像一个人的骨骼、器官，而CSS就是人的皮肤，有了这两样也就构成了一个人的肉体了，加上JavaScript这个植物人就可以对外界刺激做出反应，可以思考、运动、可以给自己整容化妆（改变CSS）等等，成为一个活生生的人。如果说HTML是肉身、CSS就是皮相、JavaScript就是灵魂。1.2. HTML/CSS/JavaScript背景在学习HMLT/CSS/JavaScript之前，我们先了解它们的背景知识。1.2. HTML/CSS/JavaScript背景 1.2.1. HTML背景：HTML作为定义万维网的基本规则之一，最初由蒂姆?本尼斯李（Tim Berners-Lee）于1989年在CERN（Conseil Europeen pour la Recherche Nucleaire）研制出来。 独立于平台，即独立于计算机硬件和操作系统。这个特性对各种受众是至关重要的，因为在这个特性中，文档可以在具有不同性能（即字体、图形和颜色差异）的计算机上以相似的形式显示文档内容。HTML 标签原本被设计为用于定义文档内容。通过使用 h1、p、table 这样的标签，HTML 的初衷是表达“这是标题”“这是段落”“这是表格”之类的信息。同时文档布局由浏览器来完成，而不使用任何的格式化标签。由于两种主要的浏览器（Netscape 和 Internet Explorer）不断地将新的 HTML 标签和属性（比如字体标签和颜色属性）添加到 HTML 规范中，创建文档内容清晰地独立于文档表现层的站点变得越来越困难。为了解决这个问题，万维网联盟（W3C），这个非营利的标准化联盟，肩负起了 HTML 标准化的使命，并在 HTML 4.0 之外创造出样式（Style）。目前所有的主流浏览器均支持层叠样式表。1.2. HTML/CSS/JavaScript背景 1.2.2. CSS背景：从HTML被发明开始，样式就以各种形式存在。不同的浏览器结合它们各自的样式语言为用户提供页面效果的控制。最初的HTML只包含很少的显示属性。随着HTML的成长，为了满足页面设计者的要求，HTML添加了很多显示功能。但是随着这些功能的增加，HTML变的越来越杂乱，而且HTML页面也越来越臃肿。于是CSS便诞生了。1994年哈坤?利提出了CSS的最初建议。而当时伯特?波斯（Bert Bos）正在设计一个名为Argo的浏览器，于是他们决定一起设计CSS。其实当时在互联网界已经有过一些统一样式表语言的建议了，但CSS是第一个含有“层叠”含义的样式表语言。在CSS中，一个文件的样式可以从其他的样式表中继承。读者在有些地方可以使用他自己更喜欢的样式，在其他地方则继承或“层叠”作者的样式。这种层叠的方式使作者和读者都可以灵活地加入自己的设计，混合每个人的爱好。哈坤于1994年在芝加哥的一次会议上第一次提出了CSS的建议，1995年的www网络会议上CSS又一次被提出，博斯演示了Argo浏览器支持CSS的例子，哈肯也展示了支持CSS的Arena浏览器。同年，W3C组织（World WideWeb Consortium）成立，CSS的创作成员全部成为了W3C的工作小组并且全力以赴负责研发CSS标准，层叠样式表的开发终于走上正轨。有越来越多的成