css笔记

css：
浏览器兼容问题：
-moz-background-size:63px 100px; /* 老版本的 Firefox */
-webkit-background-origin:content-box; /* Safari */
1.背景：background
background-repeat：在页面上对图片进行平铺
background-position:背景图片定位
background-images：背景图片（撑不起元素的宽高，行内元素没有效果）
background-attachment:当文档滚动到超过图像的位置时 ，图片是否固定
background-size:63px 100px（css3）;：控制图片大小(IE9以上可用)
2.文本：text
text-indent：首行缩进 （行内元素无效）
text-align：水平对齐（只控制文本水平对齐方式）
word-spacing：字（单词）之间的标准间隔
letter-spacing：单字母的间隔
text-decoration：装饰文本
text-shadow: 5px 5px 5px #FF0000（css3）;向文本应用阴影(IE10y以上可以用)
word-wrap:break-word（css3）;超出范围自动换行
 word-break: break-all;;超出范围自动换行（英文内容也可换行）
3.字体：font  W3C 推荐使用 em 尺寸单位
 @font-face（css3）引用自定义字体格式 （IE8以上可使用）
4.链接
a:link {color:#FF0000;} /* 未被访问的链接 */
a:visited {color:#00FF00;} /* 已被访问的链接 */
a:hover {color:#FF00FF;} /* 鼠标指针移动到链接上 */
a:active {color:#0000FF;} /* 正在被点击的链接 */
5.列表：ul
list-style-type：列表项的标志类型
list-style-image：url（）：使用图像作为标志
list-style-position：确定标志出现在列表项内容之外还是内容内部
li {list-style : url(example.gif) square inside}简写
6.表格：table
 border-collapse:collapse;将表格边框折叠为单一边框
7.轮廓：Outline
  outline-style：  轮廓样式
  outline-width：轮廓宽度
  outline-color： 轮廓颜色
8.选择器
 类选择器： .class{}           多类选择：.class1 .class2{}
id选择器(区分大小写)：#Id
属性选择器：[title] {}  所有具有title属性的元素
后代选择器：div p{} div元素里的p元素
子元素选择器：p >span{} p元素里的span元素
相邻元素选择器：div+p{} div与P元素相邻 
伪类选择器：
 语法
元素 : pseudo-class {property: value}
元素.class : pseudo-class {property: value}

例如： input:focus{background-color:yellow;}
            p:first-child {font-weight: bold;} 第一个p

伪元素：
9.块级元素与内联元素
display：none;元素隐藏  不占据文档流物理位置
display：block；此元素变为块级元素，可以为元素定宽高
display：inline；元素变为内联元素，定义宽高无效
display: inline-block;元素变为内联元素，可以定义宽高
visibility:visible；元素可见
visibility：hiddent；隐藏元素，占据实际物理位置
10.鼠标变化
cursor:pointer；手型
cursor:help；？
  
11.vertical-align:vertical-align 属性设置元素的垂直对齐方式
12.text-overflow :当文本溢出包含元素时
13.position:fixed  元素框的表现类似于将 position 设置为 absolute，不过其包含块是视窗本身。