css的一些基础知识

什么是CSS？

CSS (Cascading Style Sheets) 层叠样式表。CSS就也是一种叫做样式表（stylesheet）的技术。

CSS就好比那些绚丽的衣服，html就好比人，那些绚丽的衣服套在人身上，就变的绚丽多彩了。所以可以说CSS是来修饰HTML的。使网页变得绚丽好看。

CSS能做什么？

1、CSS把很多以前需要使用的图片的和脚本来实现的效果、甚至动画效果，只需要短短的几行代码就能搞定了。比如圆角，图片边框，文字阴影和盒阴影，过度，动画等。

2、CSS简化了前端开发人员的设计过程，更灵活的页面布局，更快的页面加载。

3、可以将站点上的所有的网页风格都使用一个CSS文件进行控制，只需修改这个css文件中行对应的代码，那么整个站点的所有页面都会随之发生变动。

4、css可以支持多种设备，比如手机，PDA，打印机，电视机，游戏机等。

5、目的：将表现与结构分离。

CSS语法结构？

CSS语法由三部分构成：选择符、属性和值

Selector(选择符) {Property(属性)：Value(值);}

例：

　　　　　　　　　　body{ background-color:#ccc}

　　　　</style>

如何引入CSS？

有三种引入方式：

1、行内引用

　　在html标签中写style属性比如：<h1 style="background-color:#ccc">这是一个标题</h1>

2、页面引用 由<style></style>定位在<head></head>之中。

　　　　例：<head>

　　　　　　　　　　　　body{ background-color:#ccc}

　　　　　　　　　　</style>　

　　　　　　 </head>

3、页外引用（外部样式表） <link rel="stylesheet" type="text/css" href="要链接外部css的路径" />

CSS优先级:就近原则

行内引用 > 业内引用 > 页外引用

CSS注释：

css代码注释，以/* 开始 */ 结束

选择符：

1. 通配选择符

*号表示所有的对象

比如*{padding:0px; margin:0px; }

2. 元素选择符

所谓的元素选择符，指以网页中已有的标签名作为名称的选择符

比如：body{} h1{}

3. 群组选择符

除了可以对单个标签进行样式指定外，还可以对一组标签进行相同的样式定义。

比如：h1,h2,p{ font-size:12px;}

4. 关系选择符

E F　　包含选择符选择所有被E元素包含的F元素

E > F　　子选择符　　　选择所有作为E元素的子元素F　

E + F　　相邻选择符　　选择紧贴在E元素之后的F元素

E ~ F　　兄弟选择符　　选择E元素所有兄弟元素F