一、行间样式表
行间样式表是指将CSS样式编码写在HTML标签中，格式如下
<h1 style="font-size:12px;color:#000FFF">
我的CSS样式。
</h1>
行间样式表由HTML元素的HTML元素的style支持，只需将CSS代码用分号隔开写在style=""之中。这是最基本的形式，但是它没有实现表现与内容分离且不能灵活的控制多个页面所以我们只是在调试CSS代码的时候使用。
二、内部样式表
内部样式表与行间样式表相似都是把CSS代码写在HTML页面中，稍微不同的是前者可以将样式表放在一个固定的位置，格式如下
<html>
<head>
<title>内部样式表</title>
<style type="text/css">
h1{font-size:12px;
color:#000FFF
}
</style>
</head>
<body>
<h1>我的CSS样式。</h1>
</body>
</html>
内部样式表编码是初级的应用形式，不能达到跨页面使用所以不适合使用。
三、外部样式表
外部样式表是CSS应用中最好的一种形式，它将CSS样式代码单独放在一个外部文件中，再由网页进行调用。多个网页可以调用一个样式文件表，这样能够实现代码的最大限度的重用及网站文件的最优化配置，格式如下
<html>
<head>
<title>外部样式表</title>
<link rel="stylesheet" rev="stylesheet" href="stylecss">
</head>
<body>
<h1>我的CSS样式。</h1>
</body>
</html>
在stylecss中的代码为
h1{font-size:12px;
color:#000FFF
}
我们在<head>中使用了<link>标签来调用外部样式表文件。将link指定为stylesheet方式，并使用了href="stylecss"指明样式表文件的路径便可将该页面应用到在stylecss中定义的样式。
1、直接在html标签元素内嵌入css样式，如
<div style="font-size:14px;color:#FF0000;">2、在html头部head部分内style声明插入代码如下：
<!--
ceshi {font-size:14px; color:#FF0000;}
-->
</style>
3、在html头部head部分内使用@import引用外部CSS文件方法
<!--
@import url(wcsscss);
-->
</style>
Wcsscss文件内代码ceshi {font-size:14px; color:#FF0000;}
4、在html头部head部分内使用link来调用外部的css文件
在head放置<linkrel="stylesheet" href="wcsscss" type="text/css"/>来调用外部的wcsscss文件来实现html引用css文件
<linkrel="stylesheet" href="wcsscss" type="text/css"/>调用css外部样式文件，首先需要创建一个css文件。比如创建一个含有以下代码的css文件：
body{width:100%;margin:0;padding:0;}
content{width:300px;height:200px;float:left;}
保存成css后缀的css文件。
现在开始在html文件中写入以下代码调用即可。
<link rel="stylesheet" type="text/css" href="这里是刚才保存的css文件的路径">样式的引用形式大致可分为以下四种：
一、行间样式，即直接加在标签上的样式 例:<div style="width:50px;"></div>
二、内联样式 即用<style> </style>标签括起来写在页面中的样式
三、外联样式：即将样式单独放到一个文件夹中，然后用link标签引入页面的形式
四，导入样式，即将样式，按模块划分或其它的分法分别放在不同的css文件中，然后用@导入到其它样式中 。此方法建议不要用，因为效率不是特别高
前三种的优先级为： 行间 > 内联 >外联在html网页中引入引入css主要有以下四种方式：\x0d\（1）行内式\x0d\
网页中css的导入方式\x0d\\x0d\（2）嵌入式\x0d\\x0d\ P{ color:red }\x0d\\x0d\ 嵌入式一般写在head中，对于单个页面来说，这种方式很方便。\x0d\\x0d\（3）导入式\x0d\ \x0d\ \x0d\ @import "jisuancss"; \x0d\\x0d\\x0d\（4）链接式\x0d\\x0d\ \x0d\导入式和链接式差不多，都是从外部引入css文件。但是链接式对于客户端用户浏览网站时，效果会好些。
HTML中常用以下三种方式定义CSS：embedding（嵌入式）、linking（外部引用式）和inline（内联式，也称行内样式）。
一：嵌入式
用户可在HTML文档头部定义多个style元素，实现多个样式表。
<style type="text/css">
<!--
body {
font-family: "宋体";
font-size: 12px;
font-style: normal;
line-height: normal;
font-weight: normal;
text-decoration: none;
}
-->
</style>
二：外部引用式
①可以在多个文档间共享样式表，对于较大规模的网站，将CSS样式定义独立成一个一个的文档，可有效地提高效率，并有利于对网站风格的维护。
②可以改变样式表，而无需更改HTML文档，这也与HTML语言内容与形式分开的原则相一致。
③可以根据介质有选择的加载样式表。
<link rel="stylesheet" type="text/css" href="Csscss" />
</Head>
三：内联式
使用该属性可以直接指定样式，当然，该样式仅能用于该元素的内容，对于另一个同名的元素则不起作用。
1、样式的属性内容直接跟在将要修饰的文字标记里[如：
2、具体格式： style="font-size:10px;font-color:#ff0000"
例如：修饰单元格里的文字
四：导入样式表
<!--
@import url("css/basecss");
-->
</style>
第二：四种样式的优先级
四种样式的优先级别是(从高至低)：行内样式、内嵌样式、链接样式、导入样式。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）