HTML基本知识及相关标签的用法.ppt

上传人:re****.1 文档编号:570825312 上传时间:2024-08-06 格式:PPT 页数:37 大小:2.49MB
返回 下载 相关 举报
HTML基本知识及相关标签的用法.ppt_第1页
第1页 / 共37页
HTML基本知识及相关标签的用法.ppt_第2页
第2页 / 共37页
HTML基本知识及相关标签的用法.ppt_第3页
第3页 / 共37页
HTML基本知识及相关标签的用法.ppt_第4页
第4页 / 共37页
HTML基本知识及相关标签的用法.ppt_第5页
第5页 / 共37页
点击查看更多>>
资源描述

《HTML基本知识及相关标签的用法.ppt》由会员分享,可在线阅读,更多相关《HTML基本知识及相关标签的用法.ppt(37页珍藏版)》请在金锄头文库上搜索。

1、HTMLHTML基本基本基本基本标签标签标签标签(一)(一)(一)(一)第一章第一章第一章第一章Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.本门课程目标学完本门课程后,你能够:学完本门课程

2、后,你能够:制作界面美观大方、面向企业应用的静态商业网站制作界面美观大方、面向企业应用的静态商业网站掌握掌握Web开发的行业规范和标准开发的行业规范和标准Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty

3、 Ltd.课程项目展示贵美商城贵美商城首页首页商品展示页(点击左边商品展示页(点击左边“商品分类商品分类”任一链接)任一链接)具体商品详细介绍页(点击任一商品图片)具体商品详细介绍页(点击任一商品图片)购物车页面(点击购物车页面(点击“立刻购买立刻购买”按钮)按钮)登录页(点击右上方的导航菜单)登录页(点击右上方的导航菜单) 注册页(点击右上方的导航菜单)注册页(点击右上方的导航菜单) 帮助中心客服页面(点击右上方的导航菜单)帮助中心客服页面(点击右上方的导航菜单) 教员现场演示贯穿项目教员现场演示贯穿项目教员现场演示贯穿项目教员现场演示贯穿项目Evaluation only.Created

4、with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.本章任务制作图文并茂的商品介绍页制作图文并茂的商品介绍页 Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Prof

5、ile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.本章目标使用使用HTML的基本结构创建网页的基本结构创建网页使用行级和块级标签组织页面内容使用行级和块级标签组织页面内容 使用图像标签实现图文并茂的页面使用图像标签实现图文并茂的页面Evaluation only.Created with Aspose.Slides for .

6、NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.什么是HTMLHTML:Hyper Text Markup Language 超文本标签语言超文本标签语言HTML:网页的:网页的“源码源码”浏览器:浏览器:“解释和执行解释和执行”HTML源码的工具源码的工具 HTML告知浏览器如告知浏览

7、器如何显示网页何显示网页Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.HTML文档的结构文档的结构我的第一个网页我的第一个网页 Hello World!HTML 网页网页头部部分头部部分主体

8、部分主体部分标签标记标签标记 HTML 文档的开始和结束文档的开始和结束网页标题网页标题网页内容,可以是网页内容,可以是文本、图像等文本、图像等这部分包括标题和其他说明信息,包括在这部分包括标题和其他说明信息,包括在 标签内标签内这这部分包含文本、部分包含文本、图图像和像和链链接,它包括在接,它包括在 标签标签内内HTML文档的基本结构Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.C

9、reated with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.记事本记事本UltraEditHTML的编辑工具操作演示操作演示操作演示操作演示11:在记事本里创建网页:在记事本里创建网页:在记事本里创建网页:在记事本里创建网页 Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evalua

10、tion only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.网页的摘要信息2-1 网页摘要信息利于浏览器解析和搜索引擎搜索:网页摘要信息利于浏览器解析和搜索引擎搜索:使用使用标签标签 搜狐搜狐-中国最大的门户网站中国最大的门户网站Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose P

11、ty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd. 网页的摘要信息2-1 使用使用标签标签(1)描述文档类型和字符编码)描述文档类型和字符编码(2)描述搜索关键字和描述)描述搜索关键字和描述提供搜索关键字和内容描述提供搜索关键字和内容描述信息,方便搜索引擎的搜索信息,方便搜索引擎的搜索 Evaluation only.Created with Aspose.Slides for .NET 3.5 Clie

12、nt Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Meta标签http-equiv属性属性:模拟模拟http消息头消息头(所谓消息头,是由所谓消息头,是由w3c定义的一些关键字,定义的一些关键字,浏览器与服务器都会遵守浏览器与服务器都会遵守)。content属性属性:消息头的属性值。消息头的属性值。常见的两个消息

13、头常见的两个消息头:(1)模拟生成一个模拟生成一个content-type消息头,告诉浏览器,返回的数据是消息头,告诉浏览器,返回的数据是html,编码,编码是是gbk。浏览器一定会以指定的。浏览器一定会以指定的gbk编码来打开该页面。需要注意:指编码来打开该页面。需要注意:指定的编码一定要与实际保存文件的编码一致。定的编码一定要与实际保存文件的编码一致。(2)模拟生成一个模拟生成一个refresh消息消息头,告诉浏览器,每隔头,告诉浏览器,每隔2秒刷新该页面。秒刷新该页面。Evaluation only.Created with Aspose.Slides for .NET 3.5 Clie

14、nt Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.HTML页面中的块和行HTML标签分类(方便后续的布局设计):标签分类(方便后续的布局设计):块级标签:显示为块级标签:显示为“块块”状,前后隔一行状,前后隔一行 行级标签:按行逐一显示行级标签:按行逐一显示 分类好处:方便后续的布局设计分类好处:方便后续的布局设

15、计 块级:块级:块内包含块内包含多行多行行级:包行级:包括文字、括文字、图片等图片等Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.块级标签根据使用场合,块级标签又细分为:根据使用场合,块级标

16、签又细分为:基本块级标签基本块级标签 常用于布局的块级标签常用于布局的块级标签 Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.块级元素与行内无素的区别 块级元素和行内元素是布局最基本的两种元

17、素,常块级元素和行内元素是布局最基本的两种元素,常见的块级元素有见的块级元素有div、p、form、ul、ol、li等,常用的等,常用的行内元素有行内元素有span、strong、em等等 块级元素会独占一行,默认情况下,其宽度自动块级元素会独占一行,默认情况下,其宽度自动填满其父元素宽度,行内元素不会独占一行,相邻的行填满其父元素宽度,行内元素不会独占一行,相邻的行内元素会排列在同一行里,直到一行排不下,才会换行,内元素会排列在同一行里,直到一行排不下,才会换行,其宽度随元素的内容而变化。其宽度随元素的内容而变化。 块级元素可以设置块级元素可以设置width、height属性。行内元素属性。

18、行内元素设置设置width、height属性无效。属性无效。 注意,块级元素即使设置了宽度,仍然是独占一行注意,块级元素即使设置了宽度,仍然是独占一行的。的。Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose P

19、ty Ltd.标题标签标题标签 一一级标题级标题 二二级标题级标题 三三级标题级标题 四四级标题级标题 五五级标题级标题 六六级标题级标题基本块级标签3-1h1h1最大最大h6h6最小最小前后隔行前后隔行操作演示操作演示操作演示操作演示22:标题标签:标题标签:标题标签:标题标签 标题标题标题标题Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.S

20、lides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.段落标签段落标签 北京北京欢欢迎你迎你 北京北京欢欢迎你,有梦想迎你,有梦想谁谁都了不起!都了不起!/p 有勇气就会有奇迹。有勇气就会有奇迹。基本块级标签3-2前后换行,类前后换行,类似教材中的段似教材中的段落落操作演示操作演示操作演示操作演示33:段落标签:段落标签:段落标签:段落标签 Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0

21、.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.水平线标签水平线标签 北京北京欢欢迎你迎你 北京北京欢欢迎你,有梦想迎你,有梦想谁谁都了不起!都了不起!/p 有勇气就会有奇迹。有勇气就会有奇迹。基本块级标签3-3横线用于内容横线用于内容分割分割单个标签的闭单个标签的闭合形式合形式操作演示操作演示操作演示操作演示44:水平线标签:水平线标签:水平线

22、标签:水平线标签 Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.练习基本块级标签需求说明:需求说明:显示唐诗介绍(显示唐诗介绍( UltraEdit环境环境 ) 完成时间:完成时间:20分钟

23、分钟分析应使用哪分析应使用哪些标签?些标签?Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.有序列表标签有序列表标签 注册步注册步骤骤: 填写信息填写信息 收收电电子子邮邮件件 注册成功注册成

24、功 常用于布局的块级标签7-1有序列表有序列表操作演示操作演示操作演示操作演示55:有序列表标签:有序列表标签:有序列表标签:有序列表标签 列表项列表项1 Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pt

25、y Ltd.无序列表标签无序列表标签 新人上路指南新人上路指南 如何激活会如何激活会员员名?名? 如何注册如何注册贵贵美会美会员员? 注册注册时时密密码设码设置有什么要求?置有什么要求? 贵贵美美认证认证常用于布局的块级标签7-2无序列表无序列表操作演示操作演示操作演示操作演示66:无序列表标签:无序列表标签:无序列表标签:无序列表标签 列表项列表项1 Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluati

26、on only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.定义描述标签定义描述标签 咖啡咖啡 一种黑色的一种黑色的热饮热饮料,原料据料,原料据说说是咖啡豆,非洲盛是咖啡豆,非洲盛产这类产这类原料。原料。 可以提神,刺激神可以提神,刺激神经经。常用于布局的块级标签7-3这种效果可以和无序列表互相这种效果可以和无序列表互相替代,因替代,因dtdt是块状元素,所以是块状元素,所以常用于图文混编的布局场合常用于图文混编的布局场合操作演示操作演示操作演

27、示操作演示77:dldl和和和和dtdt标签标签标签标签 标题标题 描述描述1 Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd. 图图片的片的HTML代代码码(后(后续讲续讲解)解) 商品名称

28、:商品名称:灿灿坤蒸气坤蒸气电电熨斗熨斗 商品价格:商品价格:388元元 商品商品简简介:金介:金钢钢低血超硬超低血超硬超顺顺滑滑,140ml透明大水箱透明大水箱设计设计常用于布局的块级标签7-4用定义描述标签实现图文混编的效果用定义描述标签实现图文混编的效果文字有一定的缩进文字有一定的缩进Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slid

29、es for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.表格表格 百度百度 新浪新浪 常用于布局的块级标签7-5-表格表格 -行行 -列(单元格)列(单元格)演示示例演示示例演示示例演示示例88:表格标签:表格标签:表格标签:表格标签 Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Create

30、d with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.常用于布局的块级标签7-6表单表单 一般和一般和table使用:使用: . . .演示示例演示示例演示示例演示示例99:表单标签:表单标签:表单标签:表单标签 Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation onl

31、y.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.常用于布局的块级标签7-7分区标签分区标签 divdiv标签可内嵌到标签可内嵌到等标签等标签内,作为普通块状元素使用内,作为普通块状元素使用一般当作结构化块状元素使用,作一般当作结构化块状元素使用,作为逻辑分区(分块)即容器来使用为逻辑分区(分块)即容器来使用 新人上路新人上路 div其其实实就是一个就是一个. 操作演示操作演示操作演示操作演示1010:分区标签:分区标签:分区标签:分区标签 Ev

32、aluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.小结1、div-ul(ol)-li :常用于分类导航或菜单等:常用于分类导航或菜单等 2、div-dl-dt-dd :常用于图文混编的场合:常用于图

33、文混编的场合 3、table-tr-td :常用于图文布局或显示数据:常用于图文布局或显示数据 4、form-table-tr-td:常用于布局表单:常用于布局表单 请说出实际开发常用的请说出实际开发常用的4种块状结构是什么?种块状结构是什么?Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client P

34、rofile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.练习常用于布局的块级标签 需求说明:需求说明:实现简单的商品购买页实现简单的商品购买页 完成时间:完成时间:25分钟分钟分析应使用哪些分析应使用哪些标签?标签?Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5

35、Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.图像标签图像标签 行级标签3-1为了不同浏览器之间的兼容,推荐使用为了不同浏览器之间的兼容,推荐使用title属性属性 ,确保能显示提示文字,确保能显示提示文字操作演示操作演示操作演示操作演示1111:图像标签:图像标签:图像标签:图像标签 Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluat

36、ion only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.alt属性与title属性 alt属性是图片的替换文字。属性是图片的替换文字。title属性规定元素的额外信息,有视属性规定元素的额外信息,有视觉效果。觉效果。 alt属性:属性:1、alt属性是考虑到不支持图像显示或者图像显示被关闭的浏览器的属性是考虑到不支持图像显示或者图像显示被关闭的浏览器的用户,以及视觉障碍的用户和使用屏幕阅读器的用户。当图片不显示用户,以及视觉障碍的用户和使

37、用屏幕阅读器的用户。当图片不显示的时候,图片的替换文字。的时候,图片的替换文字。2、alt属性值得长度必须少于属性值得长度必须少于100个英文字符个英文字符3、alt属性是属性是img标签的必须属性,如果没有特别意义的图片,可以标签的必须属性,如果没有特别意义的图片,可以写写alt=“”4、alt属性是搜索引擎判断图片与文字是否相关的重要依据,属性是搜索引擎判断图片与文字是否相关的重要依据,alt属性属性添加到添加到img主要的目的才是为了主要的目的才是为了SEO title属性:属性:1、title属性并不是必须的。属性并不是必须的。2、title属性规定元素的额外信息,有视觉效果,当鼠标放

38、到文字或属性规定元素的额外信息,有视觉效果,当鼠标放到文字或是图片上时有文字显示。是图片上时有文字显示。3、title属性并不作为搜索引擎抓取图片的参考,更多倾向于用户体属性并不作为搜索引擎抓取图片的参考,更多倾向于用户体验的考虑。验的考虑。Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Pr

39、ofile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.范围标签范围标签 :显示某行内的独特样式显示某行内的独特样式 商商品品价价格格:仅仅售售10元元行级标签3-2操作演示操作演示操作演示操作演示1212:spanspan标签标签标签标签 文本等行级内容文本等行级内容设置红色、大号字设置红色、大号字突出显示突出显示 Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evalu

40、ation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.换行标签换行标签 北京北京欢欢迎你,有梦想迎你,有梦想谁谁都了不起!都了不起! 有勇气就会有奇迹。有勇气就会有奇迹。 北京北京欢欢迎你,迎你,为为你开天辟地你开天辟地 流流动动中的魅力充中的魅力充满满朝气。朝气。 北京北京欢欢迎你,在太阳下分享呼吸迎你,在太阳下分享呼吸 在黄土地刷新成在黄土地刷新成绩绩。 北京北京欢欢迎你,像音迎你,像音乐乐感感动动你你 让让我我们们都加油去超越

41、自己。都加油去超越自己。 行级标签3-3和和的区别:的区别:前后不换行前后不换行操作演示操作演示操作演示操作演示1313:换行标签:换行标签:换行标签:换行标签 Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose

42、 Pty Ltd.为什么需要W3C标准W3C:World Wide Web Consortium,万维网联盟万维网联盟W3C的职能:负责制定和维护的职能:负责制定和维护web行业标准行业标准W3C标准包括:列的标准:标准包括:列的标准:HTML内容方面:内容方面:XHTML样式美化方面:样式美化方面:CSS 结构文档访问方面:结构文档访问方面:OM页面交互方面:页面交互方面:ECMAScript 制定统一的制定统一的web标准标准W3CNetscape的图标Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profil

43、e 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.W3C提倡的Web结构不规范的示例不规范的示例一一级级主主题题一一级级主主题阐题阐述文字述文字 二二级级主主题题二二级级主主题题相关文字相关文字项项目列表目列表1项项目列表目列表2项项目列表目列表3存在问题:存在问题:1、内容和表现没分离,后期很难、内容和表现没分离,后期很难维护和

44、修改维护和修改 2、HTML代代码码不能表示不能表示页页面的内面的内容容语义语义,不利于搜索引擎搜索,不利于搜索引擎搜索 操作演示:不规范的示例操作演示:不规范的示例操作演示:不规范的示例操作演示:不规范的示例 Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.C

45、opyright 2004-2011 Aspose Pty Ltd.W3C提倡的Web结构规范的示例规范的示例一一级级主主题题1 一一级级主主题阐题阐述文字述文字 二二级级主主题题 二二级级主主题阐题阐述文字述文字 项项目列表目列表1 项项目列表目列表2 项项目列表目列表3 W3C提倡的提倡的Web结构:结构:1、内容(结构)和表现(样式)、内容(结构)和表现(样式)分离分离2、HTML内容内容结结构要求构要求语义语义化化 操作演示:规范的示例操作演示:规范的示例操作演示:规范的示例操作演示:规范的示例 Evaluation only.Created with Aspose.Slides fo

46、r .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.body部分内容部分内容XHTML 1.0基本规范标签名和属性名称必须小写标签名和属性名称必须小写 HTML标签必须关闭标签必须关闭 属性值必须用引号括起来属性值必须用引号括起来 标签必须正确嵌套标签必须正确嵌套 必须添加文档类型声明

47、必须添加文档类型声明 1、声明必须位于文档的最前面、声明必须位于文档的最前面2、三种级别:、三种级别:Strict(严格类型)(严格类型) 、Trasitional(过度(过度类型)、类型)、 Frameset(框架类型)(框架类型) Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profi

48、le 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.练习行级元素需求说明:需求说明:完成时间:完成时间:20分钟分钟注意注意HTML结构的语义结构的语义化,遵守化,遵守XHTML1.0基本规范基本规范Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Pro

49、file 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.总结行级和块级标签有什么区别?用途?行级和块级标签有什么区别?用途?块级标签分为几类,分别包含哪些?块级标签分为几类,分别包含哪些?常用的常用的4种块状结构是什么?种块状结构是什么?W3C提倡的提倡的Web页结构是什么?页结构是什么?XHTML基本规范是什么?基本规范是什么?Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.Evaluation only.Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0.Copyright 2004-2011 Aspose Pty Ltd.

展开阅读全文
相关资源
正为您匹配相似的精品文档
相关搜索

最新文档


当前位置:首页 > 高等教育 > 研究生课件

电脑版 |金锄头文库版权所有
经营许可证:蜀ICP备13022795号 | 川公网安备 51140202000112号