网站设计与建设课件_第1页
网站设计与建设课件_第2页
网站设计与建设课件_第3页
网站设计与建设课件_第4页
网站设计与建设课件_第5页
已阅读5页，还剩37页未读， 继续免费阅读

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

网站设计与建设

Websitedesignanddevelopments网站设计与建设

Websitedesigna1第10章HTML基础

第三部分网站设计技术第10章HTML基础

第三部分网站设计技术210．1HTML简介1．什么是HTMLHypertextMrakupLanguage（超文本标记语言）用于描述超文本中内容的显示方式。这些内容的描述都是通过HTML标记来完成的。HTML的一个重要特点是超级链接（hyperlink一个HTML文件的后缀名是.html或者是.htmHTML是一个纯文本格式的ASCII文件10．1HTML简介1．什么是HTML32．HTML的历史SGML（standardgeneralizedmarkuplanguage，标准通用标记语言）语言，于1986年获得国际标准化组织的批准。这种语言是为了在各种网络环境之间、不同文件格式之间进行交流而使用的一种语言格式。它的文件格式标准化，并统一使用标记符号（tag）对文件的内容进行标记。HTML于1991年问世，它是SGML的一个子集。HTML是一种有前后关系格式化的语言，因此在HTML中除了包含文本内容，还包含通常是成对出现的标记。标记是包括在尖括号中的文本，为HTML的解释器提供指令。2．HTML的历史43．HTML的工作方式下载浏览器将文档解释为网页并在浏览器窗口中显示出来。标准HTML能在不同浏览器上产生同样的效果HTML并不能精确地定义文档信息如何显示和排列，而只是建议浏览器应该如何显示和排列这些信息4．HTML的解释器NetscapeNavigatorMicrosoftInternetExplorer其他3．HTML的工作方式510．4HTML标记与属性<html><head><title>Titleofpage</title></head><body>Thisismyfirsthomepage.<b>Thistextisbold</b></body></html>HTML元素通常用标记表示。标记分为单标记和双标记两种。<br>，它表示换行标记以“<”开始，以“>”结束。HTML的标记不区分大小写。<!-->注释内容</!-->10．4HTML标记与属性<html>6标记属性属性具有扩展HTML元素的能力。属性设置通常由属性名和属性值成对出现来构成，普通形式是name=”value”。<bodybgcolor=“yellow”>引号不对，出问题表10.1HTML的常用标记P215标记属性710．5HTML中的超链接格式：<ahref=”URL”>被链接的文本或图象</a>超链接外部链接内部链接跳转到本网站的另一个网页也叫做本地链接；绝对路径，相对路径跳转到本网页的另一个位置，也叫做页内跳转<aname=”书签名”>书签文本或图象</a><ahref=”#书签名”>被链接的文本或图象</a>。10．5HTML中的超链接格式：<ahref=”URL”810．2HTML标准及版本历史1．HTML标准WorldWideWebConsortium，W3C，HTML标准定义了构成HTML语言的每一个独立元素以及这些元素是指示如何在浏览器中显示HTML文档中的指令和标记符。这一标准确保在不同的浏览器和计算机平台上超文本显示的一致性。并非强制而只是推荐标准。10．2HTML标准及版本历史1．HTML标准92．HTML标准的版本历史①HTML1.0和2.0HTML1.0版本，测试HTML2.0——1995年11月发布②HTML3.2表格（Table）图（Figures）框架（Frames）数学等式（MathematicalEquations）改进的标记符（ImprovedTags）③HTML4.0样式表（StyleSheet）国际化特征（InternationalizationFeatures）访问特征（AccessibilityFeatures）增强的表格和表单（EnhancedTablesandForms）脚本和多媒体（ScriptingandMultimedia）Transitonal：使用但不依赖CSSStrict：摆脱结构化标注，使用CSS格式化字体、颜色、布局。Frameset：使用框架2．HTML标准的版本历史10HTML4.011999，支持XHTMLExtensibleHypertextMarkupLanguage是XML与HTML4.01的结合体分离的结构和表达：将HTML展示元素放入样式单中考虑Web的通用可访问性：在不同平台上生成文档(例如语音，使残疾人可访问WWW)帮助用户代理增强解释功能：处理和解释表格。用户代理是基于语音的阅读器和听觉有障碍的助听器XHTML1.0HTML5.0HTML4.011110．3网页的可访问性WAI：WebAccessibilityInitiativeWAI目标：确保Web核心技术对于身体、视觉、听觉和认知障碍的用户可以平等地使用/WAI/WAI/wcag-curric/WAI-WEBCONTENT10．3网页的可访问性WAI：WebAccessibil1210．6HTML的扩展缺陷：⑴文本格式的局限没有显式的布局和定位控制CSS。⑵缺乏对布局控制的能力借助表格来实现近似的效果，但对开发者的要求比较高，而且过程非常繁琐。CSS⑶无法动态改变页面内容DHTML。⑷交互困难虽然配合脚本语言和CSS，HTML可以提供一定的交互能力，但这种交互能力的功能有限。⑸适应性差不能适应越来越多的网络设备和应用的需要，比如手机、PDA、智能家电都不能直接显示HTML。其他标记语言内容和结构混合XML10．6HTML的扩展缺陷：131．动态HTMLDHTMLHTML融入了CSS，脚本语言等技术它由三部分组成，DOM（文本对象模型）DOM为网页定义了各种元素对象，使这些元素成为可以控制的对象，这是实现动态HTML的物质基础；CSS（层叠样式表）CSS是对DOM中所定义的对象效果的描述，即对各种对象不同状态的描述，这是实现动态HTML目标的描述；Script（脚本语言，比如VBScript和JavaScript）。Script把各种对象动态地赋予各种属性工具，是实现动态HTML的手段。1．动态HTMLDHTML142．XML“ExtensibleMarkupLanguage”的缩写，即可扩展标记语言。XML也是基于SGML的。它是一种元标记语言，也就是说，在XML中，开发者可以根据自己的需要定义自己的标记，只要这种标记是满足XML命名规则的。换句话说，XML是一种能创造其他语言的语言。XML的更重要的作用在于它可以表示结构化的数据，从而有利于数据交换。2．XML153．XHTML“eXtensibleHyperTextMarkupLanguage”，即可扩展超文本标记语言。是一种使用XML语法对HTML重新阐述的语言。XHTML1.0兼容HTML4.0。优势⑴XHTML能够在多种网络设备和智能终端上运行，实现了数据与展示的分离。⑵XHTML非常严谨。由于早期的HTML允许各种私有标记，所以在使用HTML开发完网页后，必须在多种浏览器环境下进行测试。而XHTML的语法是严格定义的，因此避免这种状况的发生。⑶XML是Web发展的趋势，但目前支持原始XML数据的浏览器还不是很多，而XHTML适用于多种浏览器。 ⑷XHTML能与其他基于XML的标记语言、应用程序和协议进行良好的交互工作。⑸XHTML是Web标准的一部分，能很好地运行在无线设备等用户代理上。⑹XHTML比HTML有更好的一致性，所以很少会产生功能和显示的问题3．XHTML164．其他标记语言⑴UIML：用户界面标记语言，一种界面描述语言⑵XForm：这种标记语言的目的在于将界面元素的展示与内容分离，这样会带来诸如软件复用性增强、更好的跨平台等优势。⑶XIML：扩展界面标记语言，它侧重于对不同应用程序间交互数据的描述，它比XML描述的数据更具体，更有针对性。⑷XAML：可扩展应用程序标记语言，它主要用于页面中文本、图象、控件等元素的布局。4．其他标记语言17建议不使用的标记,但大多数浏览器对这些标记还是支持的。<ISINDEX><APPLET><CENTER><FONT><BASEFONT><U><DIR><MENU>建议不使用的标记,但大多数浏览器对这些标记还是支持的。18HTML5预览Html5是继XHTML之后，由Apple，Opera，Mozilla三大网络媒体共同推举的最新HTML语言标准，用以取代Html4和现在的XHTML

在HTML5中新增了一些标签，如使用header来标记头部内容，nav标记导航内容，article标记文档中的一块独立内容，footer标记作者和版权信息，HTML5将使页面更加结构化。

HTML5预览Html5是继XHTML之后，由Appl19另外还增加了audio、video、embed、time、meter这些语义化的标签，剔除了一些无用的标签和属性，如font、center，因为这些有关于表现的标签元素已经让CSS给替代了，表现和结构的分离无论在XHTML2.0还是HTML5中都是趋势。另外还增加了audio、video、embed、time、20思考题：10.1什么是HTML？它的特点是什么？10.2常见的HTML解释器有哪些？10.13为什么在网页设计中应该使用的是相对路径而不是绝对路径？思考题：10.1什么是HTML？它的特点是什么？21网站设计与建设

Websitedesignanddevelopments网站设计与建设

Websitedesigna22第10章HTML基础

第三部分网站设计技术第10章HTML基础

第三部分网站设计技术2310．1HTML简介1．什么是HTMLHypertextMrakupLanguage（超文本标记语言）用于描述超文本中内容的显示方式。这些内容的描述都是通过HTML标记来完成的。HTML的一个重要特点是超级链接（hyperlink一个HTML文件的后缀名是.html或者是.htmHTML是一个纯文本格式的ASCII文件10．1HTML简介1．什么是HTML242．HTML的历史SGML（standardgeneralizedmarkuplanguage，标准通用标记语言）语言，于1986年获得国际标准化组织的批准。这种语言是为了在各种网络环境之间、不同文件格式之间进行交流而使用的一种语言格式。它的文件格式标准化，并统一使用标记符号（tag）对文件的内容进行标记。HTML于1991年问世，它是SGML的一个子集。HTML是一种有前后关系格式化的语言，因此在HTML中除了包含文本内容，还包含通常是成对出现的标记。标记是包括在尖括号中的文本，为HTML的解释器提供指令。2．HTML的历史253．HTML的工作方式下载浏览器将文档解释为网页并在浏览器窗口中显示出来。标准HTML能在不同浏览器上产生同样的效果HTML并不能精确地定义文档信息如何显示和排列，而只是建议浏览器应该如何显示和排列这些信息4．HTML的解释器NetscapeNavigatorMicrosoftInternetExplorer其他3．HTML的工作方式2610．4HTML标记与属性<html><head><title>Titleofpage</title></head><body>Thisismyfirsthomepage.<b>Thistextisbold</b></body></html>HTML元素通常用标记表示。标记分为单标记和双标记两种。<br>，它表示换行标记以“<”开始，以“>”结束。HTML的标记不区分大小写。<!-->注释内容</!-->10．4HTML标记与属性<html>27标记属性属性具有扩展HTML元素的能力。属性设置通常由属性名和属性值成对出现来构成，普通形式是name=”value”。<bodybgcolor=“yellow”>引号不对，出问题表10.1HTML的常用标记P215标记属性2810．5HTML中的超链接格式：<ahref=”URL”>被链接的文本或图象</a>超链接外部链接内部链接跳转到本网站的另一个网页也叫做本地链接；绝对路径，相对路径跳转到本网页的另一个位置，也叫做页内跳转<aname=”书签名”>书签文本或图象</a><ahref=”#书签名”>被链接的文本或图象</a>。10．5HTML中的超链接格式：<ahref=”URL”2910．2HTML标准及版本历史1．HTML标准WorldWideWebConsortium，W3C，HTML标准定义了构成HTML语言的每一个独立元素以及这些元素是指示如何在浏览器中显示HTML文档中的指令和标记符。这一标准确保在不同的浏览器和计算机平台上超文本显示的一致性。并非强制而只是推荐标准。10．2HTML标准及版本历史1．HTML标准302．HTML标准的版本历史①HTML1.0和2.0HTML1.0版本，测试HTML2.0——1995年11月发布②HTML3.2表格（Table）图（Figures）框架（Frames）数学等式（MathematicalEquations）改进的标记符（ImprovedTags）③HTML4.0样式表（StyleSheet）国际化特征（InternationalizationFeatures）访问特征（AccessibilityFeatures）增强的表格和表单（EnhancedTablesandForms）脚本和多媒体（ScriptingandMultimedia）Transitonal：使用但不依赖CSSStrict：摆脱结构化标注，使用CSS格式化字体、颜色、布局。Frameset：使用框架2．HTML标准的版本历史31HTML4.011999，支持XHTMLExtensibleHypertextMarkupLanguage是XML与HTML4.01的结合体分离的结构和表达：将HTML展示元素放入样式单中考虑Web的通用可访问性：在不同平台上生成文档(例如语音，使残疾人可访问WWW)帮助用户代理增强解释功能：处理和解释表格。用户代理是基于语音的阅读器和听觉有障碍的助听器XHTML1.0HTML5.0HTML4.013210．3网页的可访问性WAI：WebAccessibilityInitiativeWAI目标：确保Web核心技术对于身体、视觉、听觉和认知障碍的用户可以平等地使用/WAI/WAI/wcag-curric/WAI-WEBCONTENT10．3网页的可访问性WAI：WebAccessibil3310．6HTML的扩展缺陷：⑴文本格式的局限没有显式的布局和定位控制CSS。⑵缺乏对布局控制的能力借助表格来实现近似的效果，但对开发者的要求比较高，而且过程非常繁琐。CSS⑶无法动态改变页面内容DHTML。⑷交互困难虽然配合脚本语言和CSS，HTML可以提供一定的交互能力，但这种交互能力的功能有限。⑸适应性差不能适应越来越多的网络设备和应用的需要，比如手机、PDA、智能家电都不能直接显示HTML。其他标记语言内容和结构混合XML10．6HTML的扩展缺陷：341．动态HTMLDHTMLHTML融入了CSS，脚本语言等技术它由三部分组成，DOM（文本对象模型）DOM为网页定义了各种元素对象，使这些元素成为可以控制的对象，这是实现动态HTML的物质基础；CSS（层叠样式表）CSS是对DOM中所定义的对象效果的描述，即对各种对象不同状态的描述，这是实现动态HTML目标的描述；Script（脚本语言，比如VBScript和JavaScript）。Script把各种对象动态地赋予各种属性工具，是实现动态HTML的手段。1．动态HTMLDHTML352．XML“ExtensibleMarkupLanguage”的缩写，即可扩展标记语言。XML也是基于SGML的。它是一种元标记语言，也就是说，在XML中，开发者可以根据自己的需要定义自己的标记，只要这种标记是满足XML命名规则的。换句话说，XML是一种能创造其他语言的语言。XML的更重要的作用在于它可以表示结构化的数据，从而有利于数据交换。2．XML363．XHTML“eXtensibleHyperTextMarkupLanguage”，即可扩展超文本标记语言。是一种使用XML语法对HTML重新阐述的语言。XHTML1.0兼容HTML4.0。优势⑴XHTML能够在多种网络设备和智能终端上运行，实现了数据与展示的分离。⑵XHTML非常严谨。由于早期的HTML允许各种私有标记，所以在使用HTML开发完网页后，必须在多种浏览器环境下进行测试。而XHTML的语法是严格定义的，因此避免这种状况的发生。⑶XML是Web发展的趋势，但目前支持原始XML数据的浏览器还不是很多，而XHTML适用于多种浏览器。 ⑷XHTML能与其他基于XML的标记语言、应用程序和协议进行良好的交互工作。⑸XHTML是Web标准的一部分，能很好地运行在无线设备等用户代理上。⑹XHTML比HTML有

人人文库> 全部分类> 教育资料 > 辅导培训

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论