css3一般介绍：

CSS注释：/*CSS*/

CSS长度单位：

1.px（像素）

2.em（倍数，一般用于文字）

一、HTML嵌套CSS3样式：

1.外部（推荐）

例如HTML文件为index.html

将样式放入另一文件中，index.css

以上两个文件放入同一文件夹下

2.内部

3.内联（不推荐）

二、CSS3优先级

1.内联style

2.id选择器

3.class选择器

4.标签

[code]<!doctype html><html lang=\"en\"><head><meta charset=\"UTF-8\"><title>index</title><style>#imgid{background:#0ff;border-radius:256px;}.imgcls{background:#f0f;border-radius:256px;}img{background:#ccc;border-radius:256px;}</style></head><body><img src=\"xs.png\" id=\'imgid\' class=\'imgcls\' style=\"background:#ff0\"></body></html>

以上代码中，优先级为：内联style>#imgid>.imgid>img

三、CSS3选择器

1.常用选择器

1）标签

[code]...<style >span{font-size:10em}</style><span>linux</span>...*{} //给页面上所有的标签设置模式h1{} //给页面上所有的h1标签设置样式

2）id

[code]...<style>#imgid{font-size:10em}</style><body><img src=\"xs.png\"  id=\'imgid\' class=\'imgcls\'  style=\"background:#ff0\"></body>...#h3{} //给id是h3的标签设置样式

3）类

[code]...<style>.imgid{font-size:10em}</style><body><img src=\"xs.png\"  id=\'imgid\' class=\'imgcls\'  style=\"background:#ff0\"></body>....hcls{} //给class是hcls的一类标签设置模式

4）关联

[code]...<style>.div2 .imgcls{  /*表示div2里面的imglcs*/background:#ccc;border-radius:256px;}</style>...<body><div class=\"div1\"><img src=\"xs.png\" id=\'imgid\' class=\'imgcls\'></div><div class=\"div2\"><img src=\"xs.png\" id=\'imgid\' class=\'imgcls\'></div></body>...#div1 h1#div1 h1.ljhcls

5）组合

[code]...<style>.div1 .imgcls,.div2 .imgcls{background:#ccc;border-radius:256px;}</style>...<body><div class=\"div1\"><img src=\"xs.png\" class=\'imgcls\'></div><div class=\"div2\"><img src=\"xs.png\" class=\'imgcls\'></div><div class=\"div3\"><img src=\"xs.png\" class=\'imgcls\'></div></body>...div,h1,p,span,button{}