CSS样式的四种调用方式有什么不同？优先级有什么不同？

在HTML中常用以下三种方式定义CSS：embedding（嵌入式）、linking（外部引用式）和inline（内联式，也称行内样式）。

一：嵌入式
用户可在HTML文档头部定义多个style元素，实现多个样式表。

<Head> 
<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语言内容与形式分开的原则相一致。
③可以根据介质有选择的加载样式表。

<Head> 
<link rel="stylesheet" type="text/css" href="Css.css" /> 
</Head>


三：内联式
使用该属性可以直接指定样式，当然，该样式仅能用于该元素的内容，对于另一个同名的元素则不起作用。

    1、样式的属性内容直接跟在将要修饰的文字标记里[如：
    2、具体格式： style="font-size:10px;font-color:#ff0000"
       例如：修饰单元格里的文字

四：导入样式表

<style type="text/css">
<!--
@import url("css/base.css");
-->
</style>

第二：四种样式的优先级 

如果这上面的四种方式中的两种用于同一个页面后，就会出现优先级的问题，这里我就不再举例子来说明了，大家在下面自己证明一下下面的结论 

四种样式的优先级别是(从高至低)：行内样式、内嵌样式、链接样式、导入样式。

posted on 2013-02-21 14:30 Crazy-H 阅读(10892) 评论(0) 编辑收藏举报