优先级 。内联样式》内部样式（head）》外部样式表》缺省设置
body {
color:pink;
}
选择器
1.分组 可以直接对几个元素进行 ： h1,h2,h3 { ... }
2. 派生 li strong { font-style: italic; } 把 li里面的strong元素赋予新的规则
3. 后代选择器 在文档中利用<em>
4. 子元素选择器 h1 > strong h1里面strong子元素（而不是子元素的子元素）
5. id选择器 #idname { } 只能用一次 #sidebar p { } 派生id选择器（在sidebar里所有的p所赋予的新规则）
6.类选择器 .classname_abc { } <h1 class="classname_abc">
.fancy td { } fancy这个class中的td表格
td.fancy { } 类名为fancy的表格
7.属性选择器
[某个属性]{ } 所有带有这个属性的元素
[title=abc] { } <h1 title="abc">可以显示出来</h1>
[title~=hello] { } title名中包含hello的元素
[lang|=en] { } lang这个属性选择中开头是en的元素(开头必须是单词)
[lang^=e]{ } 开头（特定的值）
[lang$=e]{ } 结尾
[lang*=e]{ } 包含
样式表创建
<head> <link rel="styleheet" type="text/css" herf="mystyle.css" />
</head>
背景
background-color: pink;
background-image:url(http://cs-server.usc.edu:45678/hw/hw3/images/sayhello.png);
background-repeat: no-repeat;
background-attachment:fixed 图像不会跟着文字滚动（文字浮在背景上，而不是贴在背景上：默认值scroll）
background-position:center; ( center/ top right ) background-position: 30% 20%; 水平位置 垂直位置
background-position:50px 100px;
简写： background: url(/i/eg_bg_03.gif) #ff0000 no-repeat fixed center;
您需要把background-attachment 属性设置为 "fixed"，才能保证该属性在 Firefox 和 Opera 中正常工作。
文本
text-indent: 5em; ／ 20%; 首行缩进
text-align: center / left /right / justify 自动调整字母间隔，使各行元素长度相等。
【<center> 和text-align: center的区别】 <center>可以把整个元素剧中，text-align只会影响元素中的文字居中显示
word-spacing:30px; 单词间距
letter-spacing:20px; 字母间距
line-hright: 200%; 30px; 2； 行高调整（行间距） 20px是标准行间距
text-transform: uppercase ;lowercase; capitalize . 全大写 全小写 所有单词首字母大写
text-decoration: underline; overline; line-through; blink闪烁 可以叠加使用（text-decoration: overline blink）
white-space: normal; 忽略换行符，多个空格只显示一个空格
pre; 不会有任何的影响,有多个空格有换行
nowrap; 不会换行，就算溢出，使用<br>换行
下面的表格总结了 white-space 属性的行为：
| 值 | 空白符 | 换行符 | 自动换行 |
|---|---|---|---|
| pre-line | 合并 | 保留 | 允许 |
| normal | 合并 | 忽略 | 允许 |
| nowrap | 合并 | 忽略 | 不允许 |
| pre | 保留 | 保留 | 不允许 |
| pre-wrap | 保留 | 保留 | 允许 |
字体
font-family: georgia, serif, 'new york'; 当浏览器没有georgia时使用serif，有空格的字体需要��引号
font-style: normal; italic;oblique; 正常；倾斜；倾斜
font-weight: normal; bold; 500; 700; 问题：很多时候是无效的，是否跟font-family有关？
font-size：16px; 1em; 300%;
普通文本（比如段落）的默认大小是 16 像素 (16px=1em)。在所有浏览器中均有效的方案是为 body 元素（父元素）以百分比设置默认的 font-size 值：
font : italic bold 12px/30px(大小／行距) arial, sans-serif （字体family）
链接的样式
a:link { } 未访问
a:visited{ }已访问
a:hover{ } 指针扫过
a:active{ }
扫一扫
885
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
