浏览器基础培训一

1、浏览器基础培训一浏览器WhoWhatHow1.浏览器是什么？2.浏览器做什么？3.浏览器怎么做？浏览器Who浏览器是什么？浏览器Who名词解释 浏览器是个Web应用软件： 1、主要处理HTML文件内容；文件可来自服务器，或本地文件； 2、使用者与Web上内容进行交互。 备注：如果文件内的数据不包含Web格式，那么显示的是文件的原始数据内容，例如可以让浏览器显示一个纯文本，或一张图片。浏览器WhoW3C W3C是一个组织，专门负责制定、更新维护Web标准。兼容性问题：兼容性问题： 因因：虽有W3C规范，但各个浏览器对规范的理解和遵循，达不到一致； 果果：依赖某个浏览器开发的业务，给别的浏览器带来

2、严重的兼容性问题。例如在IE下显示正常的页面，在Chrome下却不正常。浏览器Who历史 IT届流行趋势：信息共享，操作简单；浏览器成就原因： 1、图像显示支持； 2、脚本语言支持； 3、插件支持。 浏览器成为互联网接入的首选软件。 现状：国外大牌厂商激烈角逐，而国内做贴牌的生意， 例如搜狗、360、遨游、世界之窗等等。浏览器What浏览器做什么？浏览器What概述笼统的讲，浏览器有如下的描述：1）页面承载业务逻辑，是一切行动的触发起源2）浏览器是执行者，执行页面的命令，执行的准则是W3C规范3）浏览器是信息透传者，负责上游页面与下游模块的信息互传浏览器What处理对象从功能上讲，包含：1、数

3、据解析2、脚本编译执行3、元素排版布局等数据解析的对象：HTML、JavaScript、CSS脚本编译执行的对象：JavaScript影响排版布局的对象：HTML、 JavaScript 、CSS浏览器What了解一下磨刀不误砍柴工，先了解最常见的web基础语言：1）HTML2）JavaScript3）CSS浏览器HTMLJavaScriptCSS介绍1.HTML介绍介绍2.JavaScript介绍3.CSS介绍了解一下浏览器WhatHTML HTML(Hypertext Markup Language)，即超文本标记语言，是用于描述web文档的一种标记语言。 网页的本质就是HTML，通过结合

4、使用其他的Web技术（如JavaScript等），可以创造出功能强大的网页。 HTML是Web编程的基础，也可以说万维网是建立在超文本基础之上的。浏览器WhatHTML超级文本1）一种类似文本的标记语言2）所谓超级链接，就是可以包含很多URL信息，通过URL信息，可得到相关数据的链接，方便浏览器方便地获取新的网页。这也是HTML获得广泛应用的最重要的原因之一浏览器WhatHTML编辑工具1、可视化编辑工具：Dreamweaver，FrontPage等2、文本编辑工具：Windows上有很多编辑软件，如记事本、UltraEdit等，Linux上有vi等3、其他，微软的office系列软件，可以将

5、文档直接另存为html网页文件 网页开发如此简单，从此改变最开始网页开发者的命运。浏览器WhatHTML特点1） HTML文档制作简单 支持不同数据格式的文件嵌入，如各种类型的图片、Flash动画等2）可扩展性 增加标识符等满足新需求，HTML采取子类元素的方式，为系统扩展带来保证3）平台无关性 同个网页，在不同的终端上访问，显示方式相同组成HTML文档主要是标签，一般格式：或或标签：不同的标签表示不同的意义属性：可以设置参数，也可以不设内容：容器里面需要展示的内容，没有内容表示单个元素浏览器WhatHTML语法格式内容内容hello word注： 表示包含的内容表示页面主体； 表示包含的内容

6、为粗体字体展示；表示换行是图片标签，其属性使用了border、src、width、height，分别为：边框粗细，图片路径，图片宽度，图片高度。浏览器WhatHTML举个例子1）问：能计算1+1=?吗，在输入信息时出错提醒一下呢？答： HTML是标记语言，没有任何逻辑处理能力2）问：针对文章的正文部分的字体颜色的设置，有没有批量设置？答：页面字体等元素只能一个一个的设置浏览器WhatHTML缺陷1）没有处理能力：JavaScript的出现解决这个问题， JavaScript可以与HTML一起协同工作，解决HTML页面不具有的业务逻辑的缺陷。 -JavaScript进行解决2）不能进行批量设置样

7、式：针对HTML页面的美化渲染比较复杂，需要针对每个元素都进行特殊美化， CSS的出现，可以进行批量美化，将网页编辑者从繁重的体力活动中解脱。 -CSS进行解决浏览器WhatHTML缺陷修复HTMLJavaScriptCSS1.HTML介绍2.JavaScript介绍介绍3.CSS介绍了解一下浏览器WhatJavaScript JavaScript在HTML页面中的标识格式： 小记：Netscape公司研发的一种脚本语言，可以嵌入到Web浏览器中使用，又由于当时Java很火，于是取名为：JavaScript（Java+Script），简称JS 其实JavaScript与Java是两个不同的语言

8、，只是名字相近1）是一种面向对象的语言，让与HTML紧密结合，网页更加“生动活泼”，给HTML页面带来生机2）增加页面逻辑处理，提高网页的可观性3）用途：利用JavaScript轻易的做出亲切的欢迎信息、漂亮的数字钟、有广告效果的跑马灯及简易的选举，还可以显示浏览器停留的时间浏览器WhatJavaScript简介浏览器WhatJavaScriptVBScriptJScriptJavaScript：由Netscape研发VBScript：由微软研发，用来打击JavaScriptJscript：由微软研发，是VBScript升级版本，但是使用者少三者本质相同，只是所承载的战略意义和目的不同var

9、StartTime = new Date();function showTime()var vTempDate = new Date(new Date() - StartTime);var hourClk = vTempDate.getUTCHours();var minClk = vTempDate.getUTCMinutes();var secClk = vTempDate.getUTCSeconds();if(hourClk 10)hourClk = 0 + hourClk;if(secClk 10)secClk = 0 + secClk;if(minClk 10)minClk = 0

10、+ minClk;document.getElementById(textvftime).innerHTML = hourClk + : + minClk + : + secClk;var ChatTimer = setInterval(showTime(), 1000);浏览器WhatHTMLJavaScript例子预览结果示例HTMLJavaScriptCSS1.HTML介绍2.JavaScript介绍3.CSS介绍介绍了解一下浏览器WhatCSS 级联样式表（Cascading Style Sheet）简称CSS，又为“风格样式表(Style Sheet)”，是用来进行网页风格设计的 级

11、联样式表，更有效地控制网页外观，精确指定网页元素位置，外观以及创建特殊效果的能力问：问：如果一个大型网站，可能有成千上万个页面，每个页面有成千上万个标签元素，针对每个元素都要设置的话，人力几乎不可能，而且容易出错？答：答：通过CSS控制，只需要修改几行就能搞定。技巧：技巧：HTML页面中定义相同类型的元素做标记，可通过CSS统一渲染该标记的所有元素的显示效果，类似C/C+的宏定义实现。使用：使用：CSS定义可放在HTML页面内，也可以保存css文件嵌入到HTML文件中，使用方式灵活。浏览器WhatCSS作用CSS 规则由两个主要的部分构成：选择范围（选择器），以及一条或多条声明浏览器WhatC

12、SS语法格式selector declaration1; declaration2; . declarationN 例如CSS描述：h1 color:red; font-size:14px;bodybackground-image: url(fnxn.jpg);background-repeat: repeat;background-color: #0099FF;浏览器WhatCSS简单例子(1)图片信息：名称：fnxn.jpg高：170px宽：170px效果图：背景全屏平铺bodybackground-image: url(fnxn.jpg);background-repeat: repeat-x;background-color: #0099FF;浏览器WhatCSS简单例子(1)图片信息：名称：fnxn.jpg高：170px宽：170px效果图：x轴方向平铺，空余填充背景色bodybackground-image: url(fnxn.jpg);background-repeat: repeat-y;background-color: #0099FF;浏览器WhatCSS简单例子(1)图片信