关于CSS的总结

CSS(Cascading Style Sheets)层叠样式表

样式定义如何显示HTML元素

样式通常存储在样式表中

使用CSS的方式：
1：内联样式 样式定义在单个的HTML元素中
2：内部样式 样式定义在HTML页的头元素中
3：外部样式 样式定义在外部的一个css文件中，由HTML页面引用样式表文件
选择器：
重点选择器：派生选择器：后代选择器、子选择器
伪类选择器：:link :visited :active(向被激活的元素添加样式)
:hover :focus(当元素获取焦点时向该元素添加样式)
背景设置：
background-color
background-image：url();
background-repeat 默认的，背景图片在水平和垂直方向上重复出现，创建一种“墙纸”的效果
repeat
repeat-x 仅在水平方向上重复
repeat-y 仅在垂直方向上重复
no-repeat仅显示一次
background-position: top bottom left right center xy x%y%
background-attachment: 默认值scroll：默认情况下，背景会随着文档滚动
fixed：背景图像固定不变

定位：

1）流定位 页面中的块级元素框从上到下一个接一个排列

行内元素从左到右水平排列

2）浮动定位

-让元素脱离普通流定位
-让浮动元素父元素的左边或右边
-浮动元素依旧位于父元素之内
浮动元素可以向左或向右浮动，直到它的外边缘碰到父元素或者另一个浮动框的边框为止
浮动元素可以覆盖未曾浮动的元素，释放原本所占的空间
float：right（left）

3）相对定位

-让浮动元素相对于本身的偏移
-覆盖未曾浮动的元素,不释放原来所占的空间
position: relative;
right: -180px;(相对于右侧向右偏移180px,偏移方向 是以元素中心为基准,朝着中心的移动都是正)

4）绝对定位

-让元素脱离普通流定位
-用到绝对定位时,首先要确定一个相对的基准,将这个基准元素设置样式（position:relative; 因为并不需要这个
基准元素释放占用的空间,所以设置为相对,是相对的一个基准元素）
-若没有选择一个基准元素,则默认选择最外层的body元素作为基准
-在目标元素样式上设计（position:absolute;）

5）固定定位

-让元素脱离普通流定位
-以整个屏幕为容器,在整个屏幕的位置一旦确定,就不会随着屏幕的下拉而滑动,会固定在确定位置不变
position：fixed;

列表样式：

life-style-type : 无序列表取值 none disc(实心圆) circle(空心圆) square(实心方块)
有序列表取值 none decimal(数字) lower-roman(小写罗马数字) upper-roman(大写罗马数字)
life-style-image:url();

默认显示方式：

1）块元素：从上到小 可设置宽高

、

、
2）行内元素：从左到右 不可设置宽高、
3）行内块：从左到右 可设置宽高、
display属性：修改元素的显示方式
none
block 块
inline 行内
inline-block 行内块

cursor属性 定义了鼠标指针放在一个元素边界内时所用的光标形状
可取值：default() pointer() crosshair() text() wait() help()