css轻松第一课

### css轻松第一课
1. 学习写css需要一个好用的编辑器：推荐sublime
2. css基础5问
*你知道css不能独立存在吗
*你知道HTML和css之间的联系吗
*你知道id和class有什么不同吗
*你知道div以及span的差异吗
*css对浏览器的兼容性：主要兼容IE,Firefox,chrome三款主流浏览器。
**话外**：W3C和浏览器厂商的设计差异导致了需要考虑浏览器的兼容。


3. **大概需要掌握常用的9种选择器：**
id或者class选择器；
*通用选择器；
标签选择器：例如:`h1{}、p{}`
后代选择器：例如:`h1 p{}`
属性选择器：例如：`h2[class]`,`h2[class=title]`,`input[type='']`
子选择器：例如：`div >#child {}`；
伪类选择器：a:hover,a:visted,a:link,a:active,a:first-child,a:lang(E)
伪元素选择器：X:first-line, X:first-letter,


4. 常见的css语句汇总
* 文本属性一览：
font-size:11px; 文字大小，单位可以有px，pt，em，%
font-family:arial,sans-serif; 文本字体，如果第一种字体浏览者的计算机没有安装，会自动显示第二种字体，建议最终都以sans-serif字体结尾
font-style:italic;  文字为斜体
font-weight:bold;  文字为粗体
color:#999;  文字颜色，可以用颜色代码，也可以用颜色的英文表示。
letter-spacing:0.1em;  文字间距，单位可以有px，pt，em
line-height:18px;  文字行距
text-align:left; 文字对齐方式。left：置左；right：置右；center；置中；jusity：左右对齐
text-decoration:none; 文字线段。none：无；underline：底线；overline：顶线；line-through：删除线
* 框线属性一览：
border:1px solid #ccc;  框线的设置依序为：框线宽度(1px)框线样式(solid)框线颜色(#ccc)
border-top:1px solid #ccc; top为框线上方，可以改成bottom，left，right。
框线样式：实线：solid；虚线：dotted；双线：double；凹框：inset；凸框：outset
* 背景样式一览：
background-color:#000; 背景颜色
background-image:url('images/bg.gif');  背景图片
background-attachment:fixed;  背景固定，不随滚动条移动。设置scroll则相反。
background-repeat:repeat;  背景重复，也可改成no-repeat,repeat-x,repeat-y。
background-position:50% 50%; 背景图片在X轴和Y轴的定位点。除了用%表示外，也可用top，bottom，left，right，center。


* 列表符号样式一览：
list-style-type:none;  隐藏条目符号
除了none以为还有decimal(阿拉伯数字)，disc(实心圆形)，circle(空心圆形)，square(实心方形)
list-style-image:url('list.gif');  图片形式


* 边界与间距
边界(margin)以及间距(padding)是大家最常用来调整图层的语法。
margin控制的是整个图层，而padding控制的是图层中的对象。