CSS样式应用方式
样式的优先级:行内样式>内部样式>外部样式(如果内部样式的<style>标签在<link>标签之前,则不一样;
4.1 链接外部样式表文件 (Linking to a Style Sheet)
<head>
<title>文档标题</title>
<link rel=stylesheet href="http://www.dhtmlet.com/dhtmlet.css" type="text/css">
</head>
4.2 定义内部样式块对象 (Embedding a Style Block)(内嵌式)
<html>
<head>
<title>文档标题</title>
<style type="text/css">
<!--
body {font: 10pt "Arial"}
h1 {font: 15pt/17pt "Arial"; font-weight: bold; color: maroon}
h2 {font: 13pt/15pt "Arial"; font-weight: bold; color: blue}
p {font: 10pt/12pt "Arial"; color: black}
-->
</style>
</head>
<body>
4.3 内联定义 (Inline Styles)(行间样式表)
内联定义即是在对象的标记内使用对象的style属性定义适用其的样式表属性。示例如下:
<p style="color: sienna; margin-left: 20px">This is a paragraph</p>
4.4 导入样式(Import Styles)
与链入外部样式的功能基本相同,只是语法和实现方式上有差别
几种方式的优先级
内联样式优先级最高,其次是链接样式,再次是内嵌式,最后是导入样式
添加CSS的方法;(以下方法可以混用,且不会造成混乱.这就是它为什么称这为"层叠样式表的原因.执行有优先级:行内插入式---头部方式---外部方式;当有多个网页要用到CSS,应采用CSS文件的方式,这样网页的代码会大大减少,修改起来也很方便.只在单个网页中使用的CSS,则应采用文档头部方式;只有在一个网页一两个地方才用到的CSS,才采用行内插入方式;
1 将样式表直接添加在HTML的标识符<tag>内:(这种方法不常用,因为这样添加无法完全发挥样式表的优势-内容结构和格式控制分别保存。
<tag style="properties">网页内容</tag>
<p style"color:blue;font-size:10pt">CSS实例</p>
2 将样式表添加在HTML的关信息标识符<head>内;
<head>
<style type="text/css">
<!--样式表的具体内容。-->
</style>
</head>
3 链接样式表
同样是添加在HTML的头信息符<head>内。
<head>
<link rel="stylesheet" href="*css" type="text/css" media="screen"
</head>
4 联合使用样式表
<head>
<style type="text/css">
<--
@import "*.css"
其它样式表的声明
-->
</style>
</head>
使用外部CSS:
这个方法可方便地管理整个网站的网页风格,它让网页的文字内容与版面设计分开.只要在一个CSS文档中定义好网页的外观风格,所有链接到此CSS文档的网页便会按照定义好的风格显示. 在CSS样式面板中右击---添加为