css布局
流式布局
display: inline | block | inline-block
block独占一行默认宽度会填满父的宽度，可设width,height,padding,margin. block可以包含block,inline,inline只能包含inline,也有例外。
inline同行显示直到宽度排满，宽度随元素内容显示，width,height无效，水平方向padding-left, padding-right, margin-left, margin-right有效，垂直方向padding-top, padding-bottom, margin-top, margin-bottom无效
inline-block同行显示，内容可以设置宽高
float: left | right | none | inherit(继承父的float属性)
浮动，脱离文档流，如果前一个元素是文档流中的元素，则浮动元素的顶部和前一个元素的底部对其，如果前一个元素也是浮动元素，则跟在前一个元素同行后面，如果宽度不够则挤在下面。
clear : none | left | right | both
清除浮动，添加后左侧或右侧或两边不允许浮动存在，如果左侧是浮动元素则换行不在同行显示，只影响添加clear的元素，不影响其他元素。
position: static | relative | absolute | fixed | auto
配合left top 使用
static 默认(相当于不设position) 不能用z-index
relative 相对于元素在流中的位置偏移，任然在流中，其他元素按照它偏移前的位置对待，可用z-index
absolute 相对于最近的已定位的(relative,absolute)祖先偏移，如果没有已定位的祖先则相对于浏览器窗口，脱离流，它后边的元素会补上它在流中的空缺，可用z-index
fixed 相对于浏览器窗口偏移，可用z-index
offsetParent(父级元素position是relative或absolute)
width/height(内容的宽高)
clientWidth=width+paddingleft+paddingright
clientHeight=height+paddingtop+paddingbottom
offsetWidth=width+paddingleft+paddingright+borderleft+borderright
offsetheight=height+paddingtop+paddingbottom+bordertop+borderbottom
offsetLeft=(offsetParent的padding-left)+(中间元素的offsetWidth)+(当前元素的margin-left)。
offsetTop=(offsetParent的padding-top)+(中间元素的offsetHeight)+(当前元素的margin-top)。
overflow //visible,hidden,scroll,auto overflow-x,overflow-y
tricks:
1.当其他元素都是position:static,需要position:absolute定位当前元素时
<div style="position:absolute;width:100%"></div> //一像素div辅助定位
2.把div放置于body下，可使absolute有fix的效果，可直接使用$('#divid').offset().top定位。
!important
white-space:nowrap
//jquery 对css的控制
$('#divid').css('propertyName') //get property value
$('#divid').css('propertyName','value') //set property value
$('#divid').offset().top //相对于浏览器
$('#divid').offset().left
$('#divid').position().top //相对于最近设置过position的元素
$('#divid').position().left
$('#divid').scrollTop(offset) //返回或设置
$('#divid').height() //content height
$('#divid').outerHeight() //等于offsetheight outerHeight(true)=offsetheight+margin
$(window).height() //浏览器高度
$('#divid').css('cssText') //var csstxt = $('#selector').css('cssText') + ';top:100;left:100;border:1px solid red;color:#f00;';$('#selector').css('cssText', csstxt);