Html标记.ppt
《Html标记.ppt》由会员分享,可在线阅读,更多相关《Html标记.ppt(136页珍藏版)》请在得力文库 - 分享文档赚钱的网站上搜索。
1、Html标记标记的形式标记本身也是文字字符串。l标记总是处于“”之间,并且这两个符号和标记名字之间不含有空格符l标记一般是成对出现的l开始符和结束符的区别就是在“”号后面有一个斜线“/”例如:标记示例单个的标记以及标记的属性l单个标记、l标记的属性属性是标记的附属集合,这些属性一般置于开始符号的括号中,并用等号“=”赋值,这个值依然处于括号中。用来精确的显示确定这些标记的显示方式。例1:例2:复合属性标记属性(2)l如果属性的值是一个简单的词或者是数字,并不包含空格符。那么可直接放在等号后面。否则的话需要加上单引号或者双引号。l等号的两边是可以存在空格的。l复合属性里面。属性出现的顺序是无关紧
2、要的。标记的语法l标记和属性是不分大小写的。如:与是一样的l结束标记没有属性l标记可以嵌套使用但必须由内至外的顺序来使用。l允许忽略标记的现象存在。Html基本结构l以开始并以结束l中间是两个主要的部分:头部字段和主体标记对中通常放置的是一些不出现在browser中的网页信息标记对则放置的是所有出现在browser中的内容。l文档类型定义(DTD)DTD文件包含用于控制网页的所有标记属性和规则。使用的是这样的标记。应该放在html的最前端。示例:示例:标记的属性lDIR属性指定了浏览器文字的阅读方向。可以赋值为ltr、rtl。默认值为前者例子:例子:P103 lLANG属性用来指定标识符中的文
3、本内容所采用的语言种类。用在这里这是将一个语言运用到整个网页。lVERSION属性定义Html的版本VERSION=“-/W3C/DTDHTML4.01/EN”标记及其属性l头部字段用来用来描述文档的属性,绝大部分文档标是不出现在浏览器的网页信息。主要是为搜索引擎和其他自动代理服务。l头部字段中所包含的标记、l标记的属性具有以下属性dir、lang、profile(格式尚未指定)标记l能起到区别网页的作用,网页载入浏览器的时候,标题出现在标题域中。有且只有一个这样的标记。示例:l如果浏览器没有发现标记,它会将其文档名置于标题域。l如果标题长度比浏览器的标题还要长,则超出的部分会被截去。标记l用
4、于添加网页的不显示信息,这部分信息包括作者、制作日期、口令等。用于帮助搜索引擎搜寻其所需要信息的时候无须查找整个网页l格式:http-equiv:表明网页需求的标题信息Name、content:使得这些信息可被用来引用如:课本P106示例:标记l用于定义网页中所有链接的基本URL其唯一的属性是href。用于给出URL。基本URL要包括协议和服务器名如:http:/l所有的相对链接都默认包含使用基于该标记的附加路径信息,可避免每次都输入相同的URL。示例:与的区别标记用来定义相对链接的基本值,而标记用于为网页中使用到的外部文件(比如类型定义及其描述)提供链接。示例:标记及属性l标记作用于Html
5、文档的主体部分,有一系列的属性来控制文档的颜色和背景等。l主要有以下属性bgcolor(背景色彩)text(非可链接文字的色彩)link(可链接文字的色彩)alink(正被点击的可链接文字的色彩)vlink(已经点击过的可链接文字的色彩)示例1示例2文字、列表和链接l文字网页中的文字是不可缺少的元素任何被置于标记之间的文字都会被显示出来。如何将文字分段落?l使用标记,标记具有align属性,该属性用来调准文字位置。示例:标题标记l标题用于在文字段落上设立标题,Html包括几种不同的标题形式。一些比正常字体小,但所有的标题形式均是以粗体来显示的。共有六种l与标记类似。标题总是另起一行来显示。示例
6、:标记l会在浏览器中间显示一条水平分割线,并有强制换行的作用。l具有下列属性sizewidthalignnoshadecolor格式:示例:改变文字的尺寸l标记使用该标记可以改变标记的文字的尺寸大小。具体方法:使用font标记里的size属性格式:文字lsize属性的定义域是从1到7。7最大。也可在尺寸标示符前加“+”、“-”号以从默认设置的尺寸上来增减。示例:另一种方法lbig、small标记方法:只需要用或标记围绕你所需要改变大小的文字即可如:欲变大的文字欲变小的文字创建Drop capl许多书第一段的第一个字母都比其余文字大得多。这种技术叫“dropcap”,示例:应用粗体和斜体格式l和
7、标记标记表示在这对标记中的文字为粗体标记表示在这对标记中的文字为斜体l两者可以联合使用,顺序无关紧要。但要注意防止交叉。示例:下划线和中划线l、标记:标记使被标记文本具有下划线、:使文本具有中划线使用方法:被标记文本被标记文本被标记文本示例:下标和上标l、标记下标的文字将会将位于浏览器窗口默认文字稍微偏下的地方;上标的文字将会出现在则位于浏览器窗口中默认文字稍微偏上的地方。示例:l小技巧可以与标记结合起来用,以缩小上下标的尺寸示例:打字文字(等宽文字)l标记使文字看起来如同打字机打出一样。被该标记标记的文字。没个字母所占宽度是一样的。如:字母I与W所占的宽度是一样的。强调标记l、标记强调标记属
8、于逻辑标记,不同于以往的固有标记。的默认格式是标记的默认格式是标记使用方法:被强调文本被强调文本引用标记l标记cite标记用于标出引证之处,该标记的默认设置文字呈倾斜格式。单标记具有与标记的功能示例:缩略字l表示所包含的文本是单词或者是短语的缩写。与其类似的还有标记。示例:标记插入和删除文字l、标记标记用于在原文中插入文字标记用于在原文中删除文字示例:这两个标记都有cite和datetime属性Cite属性:表明插入的理由Datatime属性:表明作出改动的时间。标记代码文字l、标记的作用:用于标记语法:用语标记代码中的变量:用于表示从键盘输入的文本:用于表示从上下文里抽出来的文本示例:定义标
9、记l标记用来标记那些对术语或字符的定义.示例:顺序列表l顺序列表是一种在每个元素前按数字顺序标号的列表形式。使用方法:以打开和关闭标记作为开始。然后,在每个列表元素前用标记标识.标识不需要添加结束标记。示例:改变标记中数字化的类型lType属性该属性用来改变列表的数字类型,类型包括:标准的阿拉伯数字(1)、小写英文字母(a)、大写英文字母(A)、小写罗马字母(i)和大写的罗马字母(I).使用方法:示例:构建无序列表无序列表又被称为小圆球列表l使用标记来开始其余的同有序表是一样的。Type属性:用来改变小圆球的形状,形状可以被置成discSquare、circle形状示例:链接链接使得world
10、wideweb更加“宽阔”通过链接用户能快速而方便地在许多不同网页中浏览l标记用来创建文字链接该标记中的href属性保存了链接所联系的地址l标记中的内容均被作为链接。包括文字和图像。l标记只能接受一个href属性,也只能指向一个页面。示例:名称链接l在网页中制造出“链接点”,使页面内的链接能快速到达链接点所在的文本处。方便查询。l必须在链接名称前包含数字符号(#)。例如:欲创建一个名称为TOP的链接点格式:l当标记用于名称链接时,不需要结束标记,用于其它链接的时候则需要。示例:将图像添加到WEB页面l使用标记向网页中加入图像。地址在src属性中被指定.示例:l指定图像的大小通过设置width和
11、height两个属性来达到这个目的格式:示例:提示:增加width和height属性的设置可以加快网页的下载,同一图像的大小不影响下载的速度。图像具有文字说明的效果可选的文字是与图像有关的一些说明,当用户将鼠标放到并停在图像上时,相关文字将会显示出来l使用方法设置alt属性格式示例:图像的链接图像通常能比文字更好的作为超级链接。许多的网站的导航条目都是利用图像代替文字来做链接的。l如何做到?用标记来包围标记即可格式:示例:表格(page131)l使用、来创建简单的表格。:标记了表格的开始和结束.:标记了新的一行的开始.:在每行中标记新的单元格体系结构如下体系结构如下:单元格的内容示例:表格(2
12、)l标识符仅用来标记新行而不能包含任何内容。l内容可以在间设置.标记包含于内l内的标记对的数目决定了表格中行的数目.内的标记对的数目决定了一行中所含的单元格的数目。l为了显示带边框的表格.需要设置标记里的border属性。默认的设置是不显示边框.对border设置任何非零值将自动在单元格间和表格周围加入边框.然而,当border值大于1时将仅会影响表格边框而不会影响单元格的边框。示例:表格尺寸的设置l除非专门设置,包含于单个单元格内的内容决定了整个表格的宽度.l可以在内使用width属性,设置整个表格的宽度.这个值以像素数目或用占browser窗口的百分比来设定.示例1:示例2l设置一个单元格
13、的尺寸会影响到同一行或列的所有其它单元格的尺寸。表格及单元格内文字的对齐l使用标记里align属性,可以指定表格左对齐或右对齐于浏览器边缘示例:l使用、标记里的align、valign属性,可以使单元格内的文字处于不同的位置。示例1:示例2:使用行标题和列标题l通过用代替标识符可以向表格添加标题。l如果要产生列标题,就将所有标识符放在第一行中。如果只改变每行的第一个则可以产生行标题。l标识符不必置于产生该表格边上的单元格内。它们可以出现在任何一个位置。只不过是出现在列顶部或行头行尾,会使意义更加明显而已。示例:设置表格内的色彩l使用bgcolor属性,可以为整个表格或单独行或单元格设置背景色彩
14、。bgcolor属性可以被加入到、标识符内。l还可以使用background属性来设置大到表格,小到单元格的背景图片.示例:背景示例单元格间隙和内部空格设置l标记包含两个属性能够用来在内容或单元格之间加入空格.cellpadding属性在单元格文字和单元格边缘加入空格cellspacing属性在每个单元格之间加入空格这两个属性值均以像素值来衡量.默认值为0。示例1:示例2:跨多行的单元格在设计表格的时候,有时候需要将两个或更多的邻接单元格组合成一个单元格。可以使用以下两个属性来实现这一点。这些属性在或中。lrowspan用来至少结合两个竖直单元格示例:lcolspan用来至少结合两个水平单元格
15、示例:行或列的跨越在内容不能完全放于一个单元格时非常有用。通过跨越许多单元格,不需要更改表格就能使更多的文字放入单元格.添加表格标题一般当我们看到一个表格的时候。通常在表格的上方或下方有一个标题.用来对表格中的信息进行提示l标记可以出现在标记的任何位置.通过将align设为top或bottom,标题能够显示在表格的上方或下方.默认的设置是在表格的顶部中间.示例:使用标记的好处是可以使标题随着表格的移动而自动移动。这是一般的文本所做不到的。表单的使用(page126)表单在实质上实现了用户的信息输入。它通过一些基本的控件,收集用户的请求信息,然后把这些信息传给相应的处理程序,由这些程序对用户的请
16、求做出回应。l表单所包含的控件。输入文本框、下拉列表框、按钮l表单的使用格式及所具有的属性action属性:用来确定表单所采集的信息提交给哪个服务器应用程序。method属性:用来确定表单数据提交的方式。一般有post与get两个值。表单2target属性用来确定服务程序将结果返回时在哪个框架窗口中来显示结果。l如何将控件添加到表单里方法:在表单标记对.中添加标记。type:表明该控件的类型(buttoncheckbox)name:该控件在整个HTML文档中的名称。value:表明该控件被触发的时候,传送给服务程序的值.表单3l在表单中加入按钮示例:lsubmit与reset按钮submit按
17、钮在按下的时候。会将整个表单里的所有数据发往服务程序.reset按钮在按下的时候有清除所有文本域并将所有其它的表单元素恢复到默认值的作用。示例:l在表单中加入复选框表单4复选框一般都是以成组的方式出现的,可以使用name属性来给复选框命名。示例:使用复选框的checked属性可以使该复选框在初始时被标记为已经选择。示例:单选择按钮l单选按钮同复选按钮很相似。只不过在同一时刻单选按钮只能允许一个选项被选中。使用方法:示例:要注意的地方:P127最后一行示例文本字段输入区域l文本域是一个可以让用户在其中输入字符或者是单行文本的表单元素。使用方法:示例:maxlength:表示你可以往这个输入框里输
18、入的最大的文字的个数.size:表示这个文本输入框的显示宽度password类型的文本字段输入框文本区域l文本区域是可以输入多行文字的一个区域.l使用标记来在网页上创建一个文本区元素。使用方法L:.rows:指定这个文本框显示的行数,cols:指定这个文本框显示的列数.wrap:指定文本的换行方式.可以分别取“off”、”soft”、”hard”。示例:列表框(下拉表单)l使用方法123nsize:表示下拉菜单一次显示的可选项目的个数.multiple:允许有多项被选。示例:框架(page 136)框架是一种页面布局的元素,与表格的作用对象是不同的。框架可以把浏览器分割成一个个的小窗口。从而使
19、一个浏览器窗口可以显示多个网页。l标记称之为框架容器,用来代替来充当容器,可以利用这个标记将浏览器窗口进行水平或垂直分割.所用到的属性是rows和cols.rows:水平分割cols:垂直分割l不能既指定rows又指定cols。浏览器不清楚在哪个行中分列。示例1:示例2:确定每个框架的显示内容l使用标记来指定显示在框架中的内容。每个内容都是一个独立的网页。l、属性.通过来命名一个被引用的网页.通过用来指定所引用的网页的URL.但也可以是任何能被浏览器显示的元素。示例:确定框架所占像素的宽度l在的开始标记内,用户可以用像素来指定框架的实际宽度。也可以使用符号“*”来代替需填满剩余空间的框架。像素
20、和比例值可以在一个单一属性里结合起来使用.示例:l当框架在browser中显示时,会自动加上边框。可以通过设置frameborder属性来删除这个边框示例:设置页面空白l通过设置属性marginwidth和marginheight来设置框架的空白区域。marginwidth:既设置左边的空白区也设置右边的空白区。marginheight:既设置顶端的空白区也设置底端的空白区。示例:lnoresize属性用来控制是否允许改变框架的大小。示例:滚动条l通过在标记中加入scrolling属性,可以控制框架中是否显示滚动条.属性取值范围为:yes、no、auto。默认设置是auto。示例:标记的嵌套使
21、用.l复杂的框架设计中常使用这样的方法。嵌套使用可以使一个框架的行分为几列,也可以使一列分为几行。使用方法:将某一个标记中的替换成一组标记即可。示例:注意:在一个页面中不适宜布置太多的框架。太多会让人产生烦乱的感觉。设置框架的目标l框架的作用是将页面分成几个区域,从而能有一个功能上的分区。框架之间是可以建立起内在的联系的。l使用target属性可以设置被链接的页面在指定的框架中显示。格式:文本示例:Marquee标记滚动文本内容示例:l一、什么是JavaScriptlJavaScript是一种基于对象(Object)和事件驱动(EventDriven)并具有安全性能的脚本语言。使用它的目的是与
22、HTML超文本标记语言、Java脚本语言(Java小程序)一起实现在一个Web页面中链接多个对象,与Web客户交互作用,从而可以开发客户端的应用程序等。它是通过嵌入或调入在标准的HTML语言中实现的。它的出现弥补了HTML语言的缺陷,它是Java与HTML折衷的选择,具有以下几个基本特点Javascriptl1.是一种脚本编写语言lJavaScript是一种脚本语言,它采用小程序段的方式实现编程。像其它脚本语言一样,JavaScript同样已是一种解释性语言,它提供了一个易的开发过程。它的基本结构形式与C、C+、VB、Delphi十分类似。但它不像这些语言一样,需要先编译,而是在程序运行过程中
23、被逐行地解释。它与HTML标识结合在一起,从而方便用户的使用操作。l2.基于对象的语言JavaScript是一种基于对象的语言,同时以可以看作一种面向对象的。这意味着它能运用自己已经创建的对象。因此,许多功能可以来自于脚本环境中对象的方法与脚本的相互作用。l3.简单性lJavaScript的简单性主要体现在:首先它是一种基于Java基本语句和控制流之上的简单而紧凑的设计,从而对于学习Java是一种非常好的过渡。其次它的变量类型是采用弱类型,并未使用严格的数据类型。l4.安全性lJavaScript是一种安全性语言,它不允许访问本地的硬盘,并不能将数据存入到服务器上,不允许对网络文档进行修改和删
24、除,只能通过浏览器实现信息浏览或动态交互。从而有效地防止数据的丢失。l5.动态性的lJavaScript是动态的,它可以直接对用户或客户输入做出响应,无须经过Web服务程序。它对用户的反映响应,是采用以事件驱动的方式进行的。所谓事件驱动,就是指在主页(HomePage)中执行了某种操作所产生的动作,就称为“事件”(Event)。比如按下鼠标、移动窗口、选择菜单等都可以视为事件。当事件发生后,可能会引起相应的事件响应。l6.跨平台性JavaScript是依赖于浏览器本身,与操作环境无关,只要能运行浏览器的计算机,并支持JavaScript的浏览器就可正确执行。从而实现了“编写一次,走遍天下”的梦
25、想。实际上JavaScript最杰出之处在于可以用很小的程序做大量的事。无须有高性能的电脑,软件仅需一个字处理软件及一浏览器,无须WEB服务器通道,通过自己的电脑即可完成所有的事情。JavaScript和Java的区别 虽然JavaScript与Java有紧密的联系,但却是两个公司开发的不同的两个产品。Java是SUN公司推出的新一代面向对象的程序设计语言,特别适合web应用程序开发;而JavaScript是Netscape公司的产品,其目的是为了扩展Netscape的浏览器功能而开发的一种可以嵌入Web页面中的基于对象和事件驱动的解释性语言,它的前身是LiveScript;而Java的前身是
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- Html 标记
限制150内