PHP-JWORD课程课件.ppt

单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,Html,的发展历史,这节将简单介绍,HTML,。,全称：,HyperText,Mark-up Language,译称：超文本标记语言。简意：一种为普通文件中某些字句加上标识的语言，其目的在于运用标记（,tag,）,合文件 达到预期的效果。,1,、,HTML,作 为定义万维网的基本规则之一，最初由蒂姆,本尼斯李（,Tim,Berners,-Lee,）,于,1989,年在,CERN,（,Conseil Europeen,pour la,Recherche Nucleaire,）,研制出来。,HTML,的设计者是这样考虑的：,HTML,格式将允许科学家们透明地共享网络上的信息，即使这些科学家使用的计算机差别很大。,2,、,1995,年,11,月，在,IETF,（,Internet engineering task force,）,主持下，在瑞士日内瓦举行的第一次,WWW,会议上成立了一个,HTML,工作小组。它的主要任务是把,HTML,形式化成为一种,SGML DTD,，,称之为,HTML Level 2,（,HTML 2.0,，,由本尼斯李最初设计的,HTML,被定,html 1.0,）。,3,、,从此，,html,最作为万维网的基石，一发不可收拾。在网站开发，软件开发兴旺的今天，隐藏在,b/s,架构中的，一个简单而不简单，重视而不重视的的核心，就是,html,，,无论何种,web,开发语言，,html,都是最为重要的一个基础。,Html1.0 html2.0 html4.0(,广泛应用,),xhtml,html5(,最新版本,),html,与,xhtml,什么是,XHTML?,更先进难懂的技术？,简单点说：,X,是吓唬人的，其实,XHTML,就是严谨而准确的,HTML,。,如故说,HTML,是汉语，那么,XHTML,就是标准普通话。对于现在才刚刚开始学习网页设计的朋友，直接学习,XHTML,是最佳的选择。,复杂点说：,XHTML,是,HTML,的”升级“产品。事实上它也属于,HTML家族，对比以前各个版本的,HTML,，,它具有更严格的书写标准、更好的跨平台能力。由于某些需要，,XHTML,将以前版本的,HTML,能够实现的一些功能交给了,CSS,，,这意味着你将需要学习两种技术。但是这确实是,Web,未来发展的潮流。,X,代表“可以扩展的”。,Html,的基本结构,html,包括两部分：页面头,标签中部分。网页体,中部分。,主要用来指定网页的编码（用何种语言）、网页标题、文档类型、包括要引用的样式表、,js,文件等。,是网页的内容区，网页的内容都在此区域中编辑完成。可以说是开发网页的主战场。,html,标记,(,tag),的特点：,1,、成对出现。,2,、可以相互包含3,、理论上，无限嵌套的。,Html,的基本结构,2,标签的属性：,设置背景颜色。,红色背景,设置文本颜色。,蓝色文本,设置链接颜色。,链接为蓝色,设置已使用的链接的颜色。,设置正在被击中的链接的颜色。,以上各个属性可以结合使用，如,。,引号内的,rrggbb,是用六个十六进制数表示的,RGB(,即红、绿、蓝三色的组合,),颜色，如,#,ff0000,对应的是红色。此外，还可以使用,Html,语言所给定的常量名来表示颜色：,Black,、,White,、,Green,、,Maroon,、,Olive,、,Navy,、,Purple,、,Gray,、,Yellow,、,Lime,、,AguaFuchsia,、,Silver,、,Red,、,Blue,和,Teal,，,如,表示,标志对中的文本使用蓝色显示在浏览器的框内。,是,Html,文档的主体部分，在此标志对之间可包含,、,、,、,、,、,等等众多的标志，它们所定义的文本、图像等将会在浏览器的框内显示出来。两个标志必须一块使用。,Code,：,ex 01first.,htm,Html,格式,段落标签,换行,有序列表，列表前附有序号数据，如,1,2,3,a,bc,无序列表，列表前有圆、方框。,div,布局中，主要使它。,div,这个标签，是最新网页布局思想，用来替换表格布局。,示例：,有序列表：,中国城市,北京,上海,广州,无序列表：美国城市,华盛顿,芝加哥,纽约,Code,：,ex01second.,htm,Html,文本,1.,对文本进行预处理操作,2.,标题标签,h1,为最大，,h6,为最小,3.,加粗、斜体、下划线标签,4.,同上，,tt,为打印风格字体，,cite,为引用方式，,em,强调风格，,strong,加重。这几个很少用。,5.,字体标签，可以指定所用字体、大小、颜色。,示例：,最大的标题,使用,h3,的标题,最大的标题,黑体字文本,斜体字文本,下加一划线文本,打字机风格的文本,引用方式的文本,强调的文本,加重的文本,size,取值“,+1”,、,color,取值“,red”,时的文本,Codeex 01/three.,htm,ex_02/song.html,Html,图像,1.,img,img,标志并不是真正地把图像给加入到,Html,文档中，而是将标志对的,src,属性赋值，从而显示了,html,中。,src,路径可以是相对路径，绝对路径。,src,属性在,标志中是必须赋值的，是标志中不可缺少的一部分。除此之外，,标志还有,alt,、,align,、,border,、,width,和,height,属性。,align,是图像的对齐方式,border,属性是图像的边框，可以取大于或者等于,0,的整数，默认单位是像素。,width,和,Height,属性是图像的宽和高，默认单位也是象素。,alt,属性是当鼠标移动到图像上时显示的文本,举例：,定义一个图象，大小采用图片的原始大小。,定义一个大小为,500,x200,的图像,让图像左对齐,图像的边框为,1,。,浏览器识别的图片一般为,JPG,，,GIF,，,PNG,，,分辨率：,72,万像索,2.,标志是在,Html,文档中加入一条水平线，它可以直接使用，具有,size,、,color,、,width,和,noshade,属性。,size,是设置水平线的,厚度,，而,width,是设定水平线的,宽度,，默认单位是像素。想必大家对,color,属性已经很熟悉了，在此就不再用多讲。,noshade,属性不用赋值，而是直接加入标志即可使用，它是用来加入一条,没有阴影,的水平线,(,不加入此属性水平线将有阴影,),。,Code:ex 02/image.,htm,Html,链结,链结，实现了多个页面之间的相互流转。定义格式如下：,中间是文字或者图片,href,表示页面的地址：分为相对路径和绝对路径,href,=“index.,htm,”,表示,相对路径,href,=,例：,你好,图像,Code:ex 02/link.,htm,Html,表格,在网页的设计中，表格是最常用的布局方式之一。表格的定义：,单元格,内容,表格的常用属性：,align=“left”,对齐方式,align=“left”,width=“778“,宽度,height=“100“,高度,border=“1”,边框,bgcolor,=“#F0F0F0“,背景色,background=“images/,bj,.gif“,背景图片,cellpadding,=“2“,表格的填充距，指表格内容和表格之间的距离,cellspacing,=“3“,表格的间距，指表格单元格与单元格之间的距离,title=“,鼠标经过时，显示的文字”,Code:ex 02/table.,htm,Html,表格的应用：布局,Html,表格的应用：布局,Html,表格的应用：布局,Html,表格的应用：信息列表,Code:ex 02/table_list.,htm,Code:ex 02/table_in.,htm,作业：制作边框为一像索的表格？步聚：,1,、将表格的,table,标签,border=0,cellspacing,=1,bgcolor,=,边框色,2,、将各单元格的背景色设为白色或相应色即可。,筛子的思想。,code:ex02/table01.,htm,Html,综合运作,我的个人主页：,1,、要求建立：首页、介绍、相册、简历、留言五个页面。,2,、要求有头、尾、导航，各页面风格统一。,教学生制作。,