文档介绍：《网页设计与制作》课程讲义第十六讲使用DIV+CSS格式化网页课堂回顾:我们制作网页的重要步骤就是能够布局好网页,也就是将设计好的网页设计图分割成一个个单元格,然后将每部分图片与文字等网页信息添加到布局好的结构中,在之前我们使用的布局方法是使用表格。使用表格布局网页,加以在html标记中进行各个部分的属性设置构成了我们的网页。那么当前较为流行的制作网页的另一个方法就是用DIV+CSS格式化网页。那么我们如何用DIV+CSS格式化网页?使用这种方法格式化网页有什么优越的地方呢?下面我们将通过制作网页实例的对比来学****和参照一下两者之间制作网页的区别。在前面的章节中学****了基本的网页元素,及其对应的HTML标签的语法。但对于网页设计者来说,仅学会这些是不够的。,HTML语言只用于定义网页的结构。要制作出漂亮且符合规范的网页,还需要使用CSS样式表来表现网页的外观。本章将介绍CSS的基本概念,以及通过CSS控制网页元素,如文字外观、背景设置和元素定位等。新课学****要点提示:一、CSS基本概念CSS是CascadingStyleSheets的缩写,中文译为层叠样式表,用于控制或增强网页外观样式,并且可以与网页的内容相分离。,用于对HTML语言功能的补充。1998年又推出了CSS2,进一步增强了HTML的语言功能。但由于浏览器之间的差异,对CSS的支持并不完全兼容。本书讲解的CSS主要针对IE用户。二、CSS功能介绍及优点在Web早期,网页一般用于技术交流,HTML只用于描述结构和内容。但随着Web的流行与发展,漂亮的外观变得格外重要。随着网页越来越复杂,HTML代码变得越来越繁杂,大量的标签堆积起来变得难以阅读和理解。此时CSS的出现为这种状况提供了解决之道。CSS还原了HTML语言原本的描述结构功能,不仅实现了美化页面,还使页面结构变得简洁合理且清晰可读。简单了解CSS用于表现网页,控制或增强网页的外观。三、引用CSS既然CSS有如此强大的功能,那么在网页中如何进行引用?一般有下列4种方法:1、将外部样式表链接到HTML文件上。2、将外部样式表导入到HTML文件中。3、将样式表内嵌HTML文件中。4、将样式表内联到HTML文件行中。这里我们重点学****一下第一种,将css样式表作为独立的样式文件与html文档进行关联进行网页制作。外联样式表就是把外部的样式表文件链接到网页上,从而在网页中使用样式表。此方法通过<link>标签实现,关于<link>标签在前面的章节中有详细的介绍。将<link>标签加入到<head>标签之间,具体格式如下:<head><linkrel=stylesheethref=“”type=”text/css”>…</head>我们将之前做过的实例,使用DIV+CSS的方法来进行制作,看看我们如何具体操作:注意事项:一个网页文件DIV+CSS方法制作网页的要领就是将html标记与css样式分离成为2个文件,即一个页面包括2个文件,一个是html文档,描述网页页面有什么内容,另一个就是这个html文档所关联的一个css文件,这里描述网页布局的样式以及网页内部所有元素的样式。图解:Css文件Html文件我们在看下面实例:将以前做过的这个页面使用div+css的方法