CSS3学习笔记（二）2015-12-9【从新浪云搬运】

CSS定位

改变元素在页面上的位置

cssd定位机制

普通流：元素按照其在HTML中的位置顺序决定排布的过程

浮动：

绝对布局

CSS定位属性

position ：把元素放在一个静态的、相对的、绝对的、或固定的位置中

static:偏移量不起任何效果

relative:相对布局

absolute:绝对布局，相对与其他元素，不占位置了

fixed:不管当前页面如何变化，他都不动

top： 元素向上的偏移量

left： 元素向左的偏移量

right：元素向右的偏移量

bottom：元素向下的偏移量

overflow：设置元素溢出其区域发生的事情

clip：设置元素显示的形状

vertical-align：设置元素垂直对齐方式

z-index：设置元素的堆叠顺序，谁的值大，谁在上面

浮动：

float属性可用的值

left:元素向左浮动

right:元素向右移动

none:元素不浮动

inherit:从父级继承浮动属性

clear属性：

去掉浮动属性（包括继承来的属性）

clear属性值

left、right:去掉元素向左、向右浮动

both：左右两侧均去掉浮动

inherit:从父级继承来的clear的值

css3的盒子模型

内边距

属性：

padding：设计所有边距

padding-left：设置左边距

padding-bottom：设置底边距

padding-right：设置右边距

padding-top：设置上边距

边框：

边框的样式border-style

10种

边框的单边框样式

border-to-style

边框的宽度

border-width :10px;

单边框宽度：border-top-width

边框的颜色：

border-color

border-top-color

css3边框：

border-radius:圆角边框

box-shadow:边框阴影

border-image:边框图片

外边距：

外边距接受任何长度单位、百分数值

常用属性：

margin：设置所有边距

margin-bottom ：设置底边距

margin-left :设置左边距

margin-right：设置右边距

margin-top设置上边距

外边距合并

css常用操作

对齐

使用margin属性进行水平对齐

使用position属性进行左右对齐

使用float属性进行左右对齐

分类

1尺寸操作

height：设置元素高度

line-height:设置行高

max-height:设置元素最大高度

max-width：设置元素最大宽度

min-width:设置元素最小高度

min-height:设置元素最小高度

width：设置元素宽度

2分类操作

clear:设置一个元素的侧面是否允许其他的浮动元素

cursor：规定当指向某元素之上时显示的指针类型（鼠标指向时显示方式）

display：设置是否及如何显示元素

float：定义元素在哪个方向上浮动

position: 把元素放置到一个静态的、相对的、绝对的、固定的位置

visibility ：设置元素是否可见或不可见