css

来源：互联网发布：s2011网络打印ip设置编辑：程序博客网时间：2024/05/16 14:34

qsszyx css

一、 CSS按其位置可以分成四种：

· 内联样式(Inline Style)

· 内部样式表(Internal Style Sheet)

· 外部样式表(External Style Sheet)

· 输入样式表（@import url（style/xxx.css））

1.1内联样式

1、内联样式是写在标签里面的，它只针对自己所在的标签起作用。

<p style="font-size:14px;color:red;">这个style定义段落中的字体是14像素的红色字</p>

1.2内部样式表

2、内部样式表（也称嵌入样式表）是写在<head></head>里面的，它只针对所在的Html页面有效。

<html>    <head>      <title>无标题文档</title>    <styletype="text/css">    <!--    h1.bigone{font-size:16px;color:red;text-align:center;}     //-->    </style>    </head>    <body>    <h1 class="bigone">标题文字是16像素红色居中字体。</h1>   <h1>这个标题无样式。</h1>    </body> </html>

注意：有些低版本的浏览器不能识别style标记，这意味着低版本的浏览器会忽略style标记里的内容，并把style标记里的内容以文本直接显示到页面上。为了避免这样的情况发生，我们用加HTML注释的方式（）隐藏内容而不让它显示：

1.3外部样式表

必须放在<head>区内

3、比如我们制作了一个首页，把它的样式表文件命名为index.css。方法是将下面的CSS代码复制到记事本中保存，然后将文本文档的扩展名.txt修改为.css即可。

 .h1.bigone{font-size:16px;color:red;text-align:center;}     在新建的网页中这样写：<html>  <head>   <title>无标题文档</title>  <link href="index.css rel="stylesheet"type="text/css">    </head>  <body>  <h1 class="bigone">标题文字是16像素红色居中字体。</h1>  <h1>这个标题无样式。</h1>  </body>  </html>

说明：

上面这个例子表示浏览器从index.css文件中以文档格式读出定义的样式表。rel=”stylesheet”是指在页面中使用这个外部的样式表。type=”text/css”是指文件的类型是样式表文本。href=”mystyle.css”是文件所在的位置。media是选择媒体类型，这些媒体包括：屏幕，纸张，语音合成设备，盲文阅读设备等。

一个外部样式表文件可以应用于多个页面。当你改变这个样式表文件时，所有页面的样式都随之而改变。在制作大量相同样式页面的网站时，非常有用，不仅减少了重复的工作量，而且有利于以后的修改、编辑，浏览时也减少了重复下载代码。

1.4输入样式表

4、输入样式表是用来导入已存在的外部样式表，可以使用css的@import声明将一个外部样式表文件输入到另外一个css文件中，被输入的css文件中的样式规则定义语句就成为了输入到的css文件的一部分，也可以使用@import声明将一个css文件输入到网页文件的<style></style>标签对中，被输入的css文件中的样式规则定义语句就成了<style></style>标签对中的语句。
<style>
@import url(http://……)
</stypel>