HTML与CSS网页设计全册课件(完整）.pptx

第一章  HTML与CSS网页设计概述;1.1;;1.1 Web基本概念;1.1 Web基本概念;1.1 Web基本概念;1.1 Web基本概念;1.1 Web基本概念;1.1 Web基本概念;1.1 Web基本概念;1.1 Web基本概念;1.1 Web基本概念;1.1 Web基本概念;1.1 Web基本概念;1.1 Web基本概念;1.1 Web基本概念;1.2 网页制作入门;1.2 网页制作入门;1.2 网页制作入门;1.2 网页制作入门;1.2 网页制作入门;1.2 网页制作入门;1.2 网页制作入门;安装JDK7.0;1.2 网页制作入门;1.2 网页制作入门;1.2 网页制作入门;1.3 Dreamweaver工具的使用;1.3 Dreamweaver工具的使用;1.3 Dreamweaver工具的使用;1.3 Dreamweaver工具的使用;1.3 Dreamweaver工具的使用;本章主要介绍了网页制作的基础知识，包括网页的形成，与互联网相关的一些名词，Web标准，HTML与CSS语言的特征及发展历程，常用浏览器，Dreamweaver工具的使用等。 通过本章的学习，读者应该能够简单地认识网页，了解HTML与CSS语言，熟练地使用网页制作工具Dreamweaver创建简单的网页。希望读者以此为开端，完成对本书的学习。;让IT教学更简单，让IT学习更有效;2.1;2.1 什么是HTML;2.1 什么是HTML;2.1 什么是HTML;2.1 什么是HTML;2.1 什么是HTML;2.1 什么是HTML;2.1 什么是HTML;单标记也称空标记，是指用一个标记符号即可完整地描述某个功能的标记。其基本语法格式如下：;在HTML中还有一种特殊的标记——注释标记。如果需要在HTML文档中添加一些便于阅读和理解但又不需要显示在页面中的注释文字，就需要使用注释标记。其基本语法格式如下： 注释内容不会显示在浏览器窗口中，但是作为HTML文档内容的一部分，也会被下载到用户的计算机上，查看源代码时就可以看到。;使用HTML制作网页时，如果想让HTML标记提供更多的信息，可以使用HTML标记的属性加以设置。其基本语法格式如下： 在上面的语法中，标记可以拥有多个属性，必须写在开始标记中，位于标记名后面。属性之间不分先后顺序，标记名与属性、属性与属性之间均以空格分开。任何标记的属性都有默认值，省略该属性则取默认值。;例如： 其中align为属性名，center为属性值，表示标题文本居中对齐，对于标题标记还可以设置文本左对齐或右对齐，对应的属性值分别为left和right。如果省略align属性，标题文本则按默认值左对齐显示，也就是说h1/h1等价于h1 align=left/h1。;例如： 书写HTML页面时，经常会在一对标记之间再定义其他的标记，在HTML中，把这种标记间的包含关系称为标记的嵌套。 在嵌套结构中，HTML元素的样式总是遵从“就近原则”，如上面代码中的“传智播客”这几个文字的颜色会遵从最靠近他的font标记，而size属性遵从外层的font标记，对齐属性则遵从最外层的p标记。 ;制作网页时，经常需要设置页面的基本信息，如页面的标题、作者、和其他文档的关系等。为此HTML提供了一系列的标记，这些标记通常都写在head标记内，因此被称为头部相关标记。;title标记用于定义HTML页面的标题，即给网页取一个名字，必须位于head标记之内。一个HTML文档只能含有一对title/title标记，title/title之间的内容将显示在浏览器窗口的标题栏中。其基本语法格式如下： ;meta /标记用于定义页面的元信息，可重复出现在head头部标记中，在HTML中是一个单标记。meta /标记本身不包含任何内容，通过“名称/值”的形式成对的使用其属性可定义页面??相关参数，例如为有哪些信誉好的足球投注网站引擎提供网页的关键字、作者姓名、内容描述，以及定义网页的刷新时间等。 ;（1）设置网页关键字，例如传智播客官网关键字的设置： 其中name属性的值为keywords，用于定义有哪些信誉好的足球投注网站内容名称为网页关键字，content属性的值用于定义关键字的具体内容，多个关键字内容之间可以用“,”分隔。;（2）设置网页描述，例如传智播客官网描述信息的设置： 其中name属性的值为description，用于定义有哪些信誉好的足球投注网站内容名称为网页描述，content属性的值用于定义描述的具体内容。需要注意的是网页描述的文字不必过多。;（3）设置网页作者，例如可以为传智播客官网增加作者信息： 其中name属性的值为author，用于定义有哪些信誉好的足球投注网站内容名称为网页作者，content属性的值用于定义具体的作者信息。 ;在meta标记中使用http-eq