一、CSS的基本定义


CSS全称:Cascading Style Sheets ,翻译为层叠样式表,是用来控制HTML或XML等表示样式的计算机语言,可用来对网页视觉效果进行统一编辑。CSS能够使页面表现和内容分离。能够对页面中对象的位置排版进行像素级的精确控制,支持几乎所有的字体号样式,拥有对网页对象和模型样式编辑的能力,并能够进行初步交互设计。目前版本为CSS3。


样式表诞生于1996年,目前版本为CSS3,目的是为了对布局、字体、背景、图片和其它图文效果进行精确控制。


二、CSS的基本结构


CSS由选择符和声明组成:选择符{属性:属性值},如:


body {background-color: yellow}


h1 {background-color: #00ff00}


h2 {background-color: transparent}


p {background-color: rgb(250,0,255)}


其中:


1、属性和属性值之间用‘:’冒号分隔,声明放在大括号内;


2、一个选择符可以有多个属性,属性之间用‘;’分号分开;


3、一个属性可以有多个属性值,属性值之间用‘,’空格分开。


三、CSS的加载方式


1、行内加载


可以直接在html标签内加入样式规则,标签内的方式只可控制该标签样式。语法:


<标签名称 style="样式属性:属性值;样式属性:属性值......">


在行内给段落增加背景色:


<p style="background-color:gray">文档内容</p>


2、文档表头加载


是指把样式表签入到文档表头中,如:


<!DOCTYPE html>


<html>


<head>


    <title>文档头</title>


    <meta charset="utf-8">


    <style type="text/css">


    p{background-color:blue;font-size: 24px}


    </style>


</head>


<body>


<!--注释不会显示在浏览器中-->


     <p>文档内容</p>


</body>


</html>


3、外部样式表文件加载


是指把样式定义在独立的CSS文件中,并将该文件通过链接的方式加载到html文件中。语法:


<link rel="stylesheet" type="text/css" href="*.css">,href是指向的css具体路径。


说明:


    ⑴ *.css为预先编写好的样式表文件


    ⑵ 外部样式表文件中不能含有任何像<head>或<style>这样的HTML标签。样式表仅仅由样式表规则或声明组成


    ⑶ 在href属性中可以使用绝对URL或者相对URL


    ⑷  如同发布HTML文件那样,将这个CSS文件发布到服务器中。在网页被打开时,浏览器将依照链接标签将含有链接外部样式表文件的HTML网页按照样式表规则显示。


4、外部输入表样式


外部输入样式表的方法同链接到外部样式表文件类似。其语法如下:


<style type="text/ css ">



@import url ( 外部样式表的文件名称 );



</style>

    说明:

   ⑴ import语句后的“;”号是必须的。



   ⑵ 要输入的样式表文件的扩展名为 . css 。