选择器
- 组选择器
h1,h2,h3{
color:red;
} ```
<code> 所有h1,h2,h3都是红色</code>
- 派生选择器
li strong {
font-style: italic;
} 然后所有 <li><strong> 斜体</strong></li>元素 字体为斜体 ```
- id 选择器
<p> id 选择器由＃号开头</p>
- id 选择器和派生选择器
font-style: italic;
text-align: right;
margin-top: 0.5em;
} ```
- 类选择器
```.center {text-align: center} ```
- 属性选择器
```[title]
{
color:red;
} ```
###CSS引用
- 外部样式表
```<link rel="stylesheet" type="text/css" href="my.css" />
- 内部
<style type="text/css"> hr {color: sienna;}
p {margin-left: 20px;}
body {background-image: url("images/back40.gif");}
</style>
- 嵌套
<style type="text/css">
hr {color: sienna;}
p {margin-left: 20px;}
body {background-image: url("images/back40.gif");}
</style>
注意，同时引用，嵌套覆盖内部，内部覆盖外部
常用属性
- 背景色
背景色 p {background-color: gray; padding: 20px;} 背景图 body {background-image: url(/i/eg_bg_04.gif);} background-repeat:no-repeat; 是否重复，不重复 background-position 属性设置背景图像的起始位置。 ／／左上角是 0% 0%。右下角是 100% 100%。 ／／100px,100px 像素 ／／top left，top center，top right，center left，center center，center right，bottom left，bottom center，bottom right - 文本
缩进
text-indent: 5em; //缩进文本
text-indent: 20%; //缩进文本 ,占父类的百分比
***********************************************************
水平对齐
text-align:justify;//与left不同，这是两端对齐，将父类填满
***********************************************************
字间隔
word-spacing: 30px;
word-spacing: -0.5em; //设置为负，会导致文字重合。
***********************************************************
字母间隔
字母间隔是单个字母的间隔，和上面字间隔(word 单词，w o r d 字母)的区别
letter-spacing: 30px;
letter-spacing: -0.5em; //设置为负，会导致文字重合。
***********************************************************
字符转换
text-transform: uppercase，none，lowercase
，capitalize
***********************************************************
文本装饰
text-decoration: none，underline，overline，line-through，blink
依次效果是：没有，下划线，上划线，删除线，闪烁blink ***********************************************************
字间隔
word-spacing: 30px;
word-spacing: -0.5em; //设置为负，会导致文字重合。
***********************************************************
-列表
例：ul{
list-style:square:inside url('/img/xxx.jpg');
}
list-style,list-style-image,list-style-position,list-style-type....
- 轮廓（Outline）
更多
end
