CSS: cascading style sheets(层叠样式表)
css2.0是现在我们教的版本（2013.11月教的）
css3.0是最新的版本
推荐一个学习CSS的网站：禅意花园（PS：顶级优秀的网站）
.dtd 文档类型定义: 这个是用来让一些低级版本的浏览器识别最新技术的命令.
eg: IE4.0版本的,如果识别最新的ＨＴＭＬ的代码，有加上这个（ＨＴＭＬ代码上面自动生成的这个东西)
浏览器就会自动到网站下载这个东西.然后就可以识别最新的命令
charset=UTF-8： 写这个是为了让国外的人们可以看到中文.和显示中文,
国外的浏览器是英文版本的.所以如果没加这个的话,识别的是英文版本的.就会出现乱码....
CSS的作用:（面试的时候还可以掰几句，所以几下几个作用还是很用必要的。）
1,将内容和格式分离
2,极强的控制页面布局能力
3,做体积更小的,下载更快的,更安全网页
4,可以将许多网页同时更新,更快更容易
5,让不同的浏览器显示相同的界面
说了这么多CSS的好处，那到底怎么用呢？
<head>
<style type="text/css">
选择器,选择器{规则:值;..............}
</style>
</head>
CSS分类（左边的内容，右边是例子）
| 一,内部样式表(针对本页面有效) 1、HTML选择器: 特点 ,选择器就是HTML元素,好处:简单.. 不足:用了这个以后的那个HTML元素的效果就回不到原来那样. 2、class(类)选择器: 规则: .xd{.......} 使用: <元素 class="xd">xxxx</元素> 优点:想用就用.... 3、id选择器 #xxx{} <元素 id="xxx">----------------</元素> 和class的区别: 这个只能使用一次,但是不使用一次也没错,只是不规范而已 |
1,HTML选择器 <head> <style type="text/css"> b {color:"red"; font-size:50px} </style> </head> 2,class选择器 3,id选择器 |
| 二,行内样式表(针对单独元素有效) <p style="规则:值;......">xxxxxxxxxxx</p> |
|
| 三,外部样式表(针对所有页面有效) 把那个代码写在一个*.css的文件中 写进文件的东西 只有 b {color:"red"; font-size:50px} 其他的style type="text/css"和其他都不要加,也不能加 使用方法: <link rel="stylesheet" href="xx.css"/> |
<link rel="stylesheet" href="xx.css"/> |
样式表的有优先级别的问题（就近原则）
| 类型 | size | color |
| 外部样式表 | 50 | green |
| 内部样式表 | 60 | red |
| 行内样式表 | 20 | pink |
元素 最终 size: 20 , color: pink
优先级 行内>内部>外部(就近原则)
=--------============================================================
情景选择器: p b{ size:12px; }
这个选择器只有在这样的情况下才有用....
<p><b>xxxxxxxxxxxxxxx</b></p>
<p><a><b>xxxxx</b></a></p> (<p>里面有包含就会起作用)
如果只想<p>下面一级的可以用，但是下面两级或多级的不能用怎么办？
其实只要加上一个 > 这个符号就可以了
p>b{ size:12px; }
同理:
p .xd{}
<p> <b class="xd"></b></p>
------------------------------------------------------------
.xd .xxd{}
<p class="xd"><b class="xxd"></b></p>
------------------------------------------------------------
#xd .xdx{}
<p id="xd"><b class="xdx"></b></p>