CSS教程（三）--将样式套用到网页上_网页制作_学习笔记★闵涛★计算机学习电脑编程软硬件技巧


	转至繁体中文版	\| 网站首页 \| 图文教程 \| 资源下载 \| 站长博客 \| 图片素材 \| 武汉seo \| 武汉网站优化 \|

CSS教程（三）--将样式套用到网页上

作者：闵涛文章来源：闵涛的学习笔记点击数：646 更新时间：2009/4/23 13:47:31

定义好的CSS样式要套用到HTML网页，大致可分为下列几种方法：

整页套用样式：

是直接在HTML网页的标题源码中的<head>与</head>之间，使用<style>与</style>这组标记来定义样式。

如：

<html>
<head>
<style type="text/css">

</style>
</head>
<body>
<h1>本段文字设成蓝色并居中</h1>
<h2>本段文字设成红色并靠右</h2>
</body>
</html>

定义在<style>与</style>标志之间的样式不但可以定义在<head>与</head>也可以定义在<body>与</body>之间。但定义在<head>与</head>之间的有效围是整个网页。

链接外部样式文件

如果有多个网页要有相同的外观设计，那么最好将所有的样式保存成独立的CSS样式文件。然后把每个网页都链接这个样式。

1、建立CSS样式文件

CSS样式文件的内容与普通的HTML文件相同，只是将HTML文件中的样式设定部分，单独存成扩展名为.css的文件。

如：（CSS-04.CSS）
H1 {color:bule}
H2 {color:red;
text-align:center;}
...
...

链接外部样式文件

建立好样式文件后，就可以将其套用到需要的HTML网页上，方法是在<head>与</head>之间加上：

<link rel=stylesheet type="text/css" href="样式文件的URL">

*一个样式文件可以链接到多个HTML文件，一个HTML文件也可以链接多个样式文件。

局部套用样式

这种方式通常用于希望局部修改某个标记的属性，而不希望将样式套用在整份文件时。也就是针对网页设计的特别需要，我们可以利用STYLE属性，直接在HTML标记内设定CSS样式，以局部修改样式设定，这种方法就称为行内(in-lime)设定。如：

<h1 style="color:red;font-family:宋体">局部套用样式<h1>

混合使用各种套用方式

针对各种不同内容的网页，以上四种套用样式的方法经常会混全使用。而混合使用样式的方式，即称为“级联样式”。

没有相关教程

教程录入：mintao 责任编辑：mintao

上一篇教程： CSS教程（四）--样式选择器

下一篇教程： CSS教程（二）--建立样式表

【字体：小大】【发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口】

注：本站部分文章源于互联网，版权归原作者所有！如有侵权，请原作者与本站联系，本站将立即删除！本站文章除特别注明外均可转载，但需注明出处！ [MinTao学以致用网]

　网友评论：（只显示最新10条。评论内容只代表网友观点，与本站立场无关！）

同类栏目

· Web开发  · 网页制作
· 平面设计  · 网站运营
· 网站推广  · 搜索优化
· 建站心得  · 站长故事
· 互联动态

热门推荐

没有教程

赞助链接

闵涛博文

500 - 内部服务器错误。

您查找的资源存在问题，因而无法显示。

鄂公网安备 42011102001154号

站长：MinTao ICP备案号：鄂ICP备11006601号-18

闵涛站盟:医药大全-武穴网。A打造B、C、D……