§ ITPOW >> 文档 >> CSS

ITPOW教程-CSS(1)

作者:ITPOW 来源:ITPOW 日期:2006-5-16

ITPOW教程 从用出发


一、样式表是什么?
  CSS 是 Cascading Style Sheet 的缩写,即“层叠样式表单”,也即样式表,是用于指定网页样式(如宽度、背景、字体颜色等)的一种标记性语言。我们所说的 CSS2 即 CSS 的第二个版本,是目前较为通用的版本。

二、为什么使用样式表?
  样式表可以指定网页的样式,HTML 也可以指定网页的样式,比如样式表可以指定网页的背景颜色,HTML 也可以指定网页的背景颜色,那我们为什么要使用样式表,而不使用 HTML 指定呢?
  1、将网页内容与网页样式分离。
  常规的网页,网页内容与网页样式混合在一起造成了很多不便,比如 ASP 程序员在输出网页内容时必须考虑网页样式。
如果采用样式表,则不会有此尴尬,ASP 程序员在输出网页时,只需要告诉网页制作人员网页有哪些内容,不需要考虑这些内容用什么颜色、用多大的字号等,而网站制作人员只需要根据这些内容写样式表即可。
  2、精简代码。
  大多数情况下用 CSS 可以使整个网页代码更整洁、更精简。
  3、样式复用。
  一个样式可以在多个网页的多个地方使用,保持了网页的风格,便于维护。比如可以用一个样式表文件确定多个页面的背景颜色,要修改背景颜色时,只需要修改一个样式表文件即可,而如果使用传统的 HTML 方式则需要为每个网页更改背景颜色。

三、样式表存放在什么地方?
  1、单独的文件,比如 style.css。公用样式表或内容较多的样式表用此法。
  2、放在 HTML 代码的 head 区。仅用于当前网页的样式表一般可用此法。
  3、直接写在 HTML 标签里,比如<table style="border-collapse: collapse">。不推荐用此法,因为它违背了样式表的初衷--将网页内容与网页样式分离。

四、如何使用单独的样式表文件?
  前面讲过样式表可以以单独的样式表文件存放,比如 style.css,那么怎样将该文件用到 HTML 网页中呢,有两种方法。
  1、连接。
  在 head 区写:<link rel="stylesheet" href="样式表文件路径" type="text/css">
  2、输入。
  在 head 区写:
  <style type="text/css">
  @import url("样式表文件路径");
  </style>

五、“连接”与“输入”有何区别?
  前面所说的使用样式表的两种方法有何区别呢,如下:
  “连接”:不用每次刷新网页都读取样式表,但网速慢时读取样式表会失败。
  “输入”:每次刷新网页都读取样式表,即使网速很慢,也会成功读取样式表。

六、head 区写样式表,如何写?
  样式表除了以单独的文件存放外,还可以放在 HTML 的 head 区,我们又称嵌入样式表,写法是:
  <style type="text/css">
  样式表内容
  </style>

相关文章:四种方式将样式表应用到HTML

相关文章