文档介绍：1 / 7
《网页设计和制作》课程讲义
第十六讲运用DIV+CSS格式化网页
课堂回顾：我们制作网页的重要步骤就是能够布局好网页，也就是将设计好的网页设计图分割成一个个单元格，然后将每部分图片和文字等网页信息添加到布局好的结构中，1 / 7
《网页设计和制作》课程讲义
第十六讲运用DIV+CSS格式化网页
课堂回顾：我们制作网页的重要步骤就是能够布局好网页，也就是将设计好的网页设计图分割成一个个单元格，然后将每部分图片和文字等网页信息添加到布局好的结构中，在之前我们运用的布局方法是运用表格。运用表格布局网页，加以在html标记中进行各个部分的属性设置构成了我们的网页。那么当前较为流行的制作网页的另一个方法就是用 DIV+CSS格式化网页。那么我们如何用DIV+CSS格式化网页？运用这种方法格式化网页有什么优越的地方呢？下面我们将通过制作网页实例的对比来学****和参照一下两者之间制作网页的区分。
在前面的章节中学****了基本的网页元素，及其对应的HTML标签的语法。但对于网页设计者来说，仅学会这些是不够的。在Web ，HTML语言只用于定义网页的结构。要制作出美丽且符合规范的网页，还须要运用CSS样式表来表现网页的外观。本章将介绍CSS的基本概念，以及通过CSS限制网页元素，如文字外观、背景设置和元素定位等。
新课学****要点提示：
一、 CSS基本概念
CSS是Cascading Style Sheets的缩写，中文译为层叠样式表，用于限制或增加网页外观样式，并且可以和网页的内容相分别。CSS ，用于对HTML语言功能的补充。1998年又推出了CSS 2，进一步增加了HTML的语言功能。但由于阅读器之间的差异，对CSS的支持并不完全兼容。本书讲解的CSS主要针对IE
2 / 7
用户。
二、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>
<link rel=stylesheet href=“” type=”text/css”>
3 / 7
…
</head>
我们将之前做过的实例，运用DIV+C