如何应用CSS到网页中

来源:www.w3c2.com 本站时间:07-11-24 点击数:

CSS编码可以以多种方式灵活的应用到我们所设计的XHTML页面之中，选择方式根据我们对设计的不同需求来制定。

一：行间样式表

行间样式表是指将CSS样式编码编写在XHTML标签之中，类似于如下格式

行间样式表由XHTML中元素的style属性所支持，我们只需要将CSS代码用;分号隔开书写在style=""之中便可完成对当前标签的样式定义，是CSS样式定义的一种基本形式。
然后我们在此极力不推荐这种样式表编写方式。行间样式表仅仅是XHTML标签对于style属性的支持所产生的一种CSS样式编写方式，并不符合表现与内容分离的设计模式，使用行间样式表于使用表格式布局从代码结构上来说完全相同，仅仅利用了CSS对于元素的精确控制优势，并没能很好的实现表现与内容的分离，因此我们应当完全杜绝这种CSS编写方式。此方式最好仅仅在需要调试的时候临时使用。

二：内部样式表

内部样式表与行间样式表相似之处在于，也是将CSS样式编写在页面之中，所不同的是，可以将样式表统一放置在一个固定未知。如下代码所示：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>CSS2.0教程__(X)Html+CSS__致力于web2.0标准的应用与推广</title>
<style type="text/css">
ul {
padding:0;
margin:0;
list-style:none;
}
li {
float:left;
width:160px;
}
</style>
</head>
<body>
</body>
</html>

样式表作为页面中的一个单独部分，有<style></style>标签标记在<head></head>之中。
内部样式表是CSS编码的初级应用形式，但仍然不是我们所推荐的编写方式，它只能够针对当前页面有效，不能够跨页面执行，因此达不到CSS代码重用的目的。

三：外部样式表

外部样式表是CSS应用中最好的一种形式。将CSS样式编码单独编写在一个独立文件之中，由网页进行调用，多个网页可以调用同一个样式文件，因此能够实现代码的最大化重用及网站文件的最优化配置，是我们推荐的编写方式。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>CSS2.0教程__(X)Html+CSS__致力于web2.0标准的应用与推广</title>
<link rel="stylesheet" rev="stylesheet" href="css/style.css" type="text/css" />
</head>
<body>
</body>
</html>

在如上例所示XHTML代码之中，在<head>中使用<link>标签，我们可以将link指定为stylesheet样式表方式，并使用href="css/style.css"指明了样式表文件的路径，我们只需要将样式单独编写在css/style.css文件之中，便可以使该页面应用在style.css中所定义的样式。
CSS在页面中的应用方式主要目的在于实现良好的网站文件管理及样式管理，分离式的结构有助于我们合理划分表现(样式表)与内容(XHTML中的内容)。

loading... 免责声明：本站刊载此文不代表同意其说法或描述，仅为提供更多信息，也不构成任何建议。
对本文有任何异议，请联络：cipin@163.com 转载要求：作者及来源信息必需保留。转载之图片、文件，链接请不要盗链到本站，且不准打上各自站点的水印。

如何应用CSS到网页中

来源:www.w3c2.com 本站时间:07-11-24 点击数:

推荐教程

热门排行

如何应用CSS到网页中

来源:www.w3c2.com 本站 时间:07-11-24 点击数:

推荐教程

热门排行

来源:www.w3c2.com 本站时间:07-11-24 点击数: