应用CSS到网页中

2008-03-05 11:15:22

　标签：应用 CSS　　　[推送到技术圈]

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

1、行间样式表

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

[ ...文本示例... ]

</h1>

行间样式表由XHTML中元素的style属性所支持，我们只需要将CSS代码用；分号隔开书写在style=""之中便可以完成对当前标签的样式定义，是CSS样式定义的一种基本形式。

然而我们在此极力不推荐这种样式表编写形方式。行间样式表仅仅是XHTML标签对于style属性的支持所产生的一种CSS样式编写方式，并不符合表现与内容分离的设计模式，使用行间样式表与使用表格布局从代码结构上来说完全相同，仅仅利用了CSS对于元素的精确控制优势，并没能很好的实现表现与内容的分离，因此我们因刚完全杜绝这种CSS编写方式，此方式最好仅仅在需要调试CSS样式的时候临时使用。

2、内部样式表

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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtmll/DTD/xhtml-transitional.dtd">

<head>

ul{

padding : 0 ;

margin : 0 ;

list-style : none ;

}

li {

float : left ;

width : 160px ;

}

</style>

</head>

<body>

</body>

</html>

样式表作为页面中的一个单独部分，由<style></style>标记在<head></head>之中。

内部样式表示CSS样式编码的初级应哟娜搞形式，但仍然不是我们推荐的编码方式，它只能针对当前网页有效，不能够跨页面执行，因此达不到CSS代码重用的目的。在实际的大型网站开发中，应当使用外部样式表形式。

3、外部样式表

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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtmll/DTD/xhtml-transitional.dtd">

<head>

<link rel="stylesheet" rev="stylesheet" href="style.css" type="text/css" />

</head>

<body>

</body>

</html>

如在上例所示XHTML代码之中，在<head>中使用<link>标签，我们可以将link指定为stylesheet样式表方式，并使用href="style.css"指明了样式表文件的路径，我们只需要将样式表写在style.css文件中，便可以使该页面应用在style.css中所定义的样式。

CSS在页面中的应用方式主要目的在于实现良好的网站文件管理及样式管理，分离式的结构有助于我们合理划分表现（样式表）与内容（XHTML中的内容）。

上一篇 CSS数值单位　

类别：未分类 ┆ 技术圈() ┆ 阅读() ┆ 评论() ┆推送到技术圈 ┆返回首页

相关文章

文章评论

[1楼]

[匿名]derick

2008-03-05 13:25:44

分享了。。

昵称：
验证码：		点击图片可刷新验证码　　博客过2级，无需填写验证码
内容：

echoright - CSS

应用CSS到网页中