css样式表设置

有参考此片博文

 1.内联式样式表

是指将CSS样式编码写在HTML标签中,在标签内编写的样式能影响的范围最小,只改变本标签的文字样式,同样的标签不会受到影响,也称行间样式表。

格式如下

<h1 style="font-size:12px;color:#000FFF"> 我的CSS样式。 </h1> 

 

行间样式表由HTML元素的HTML元素的style支持,只需将CSS代码用分号隔开写在style=""之中。这是最基本的形式,但是它没有实现表现与内容分离且不能灵活的控制多个页面所以我们只是在调试CSS代码的时候使用。

2.内部样式表

在html中通过适用<style>标签可以设置影响整个文档的样式,而且与行间相比,内部样式表可以把样式集中放在一个固定的位置。

格式如下

<html> 
<head>  
  <title>内部样式表</title>  
  <style type="text/css">     
  h1{font-size:12px;  color:#000FFF}  
  </style>  
</head>  
<body>  
  <h1>我的CSS样式。</h1>  
</body>  
</html>

 内部样式表编码是初级的应用形式,不能达到跨页面使用所以不适合使用。

3.外部样式表

3.1我们在<head>中使用了<link>标签来调用外部样式表文件。将link指定为stylesheet方式,并使用了href="style.css"指明样式表文件的路径便可将该页面应用到在style.css中定义的样式。

<html>
 <head>
 <title>外部样式表</title>
 <link rel="stylesheet" rev="stylesheet" href="style.css">
 </head>
 <body>
 <h1>我的CSS样式。</h1>
 </body>
 </html>

 外部style.css的代码为:

h1{font-size:12px;color:#000FFF}

 3.2使用@import引用外部样式表

@import在<style>标签内使用,而且必须放在其他css样式之前,语法代码如下:

@import url(外部样式地址)

url为关键字,不能随便更改,外部样式地址是指外部样式的URL,可以是绝对,也可以是相对,除了语法和所在位置与<link>标签不同,其他使用方法和效果都是一样的。

<style type="text/css">
@import url(8.4.1.css);
h1{ color:red}
</style>

 注意后面有分号。

 

posted @ 2016-12-15 16:45  叶缓  阅读(704)  评论(0编辑  收藏  举报