focus、click、blur、display、float、border、absolute、relative、fixed

onfocus:获取焦点,点击时，按着不放
onclick:点击松开之后，未点击其他处
onblur:点击松开之后，又点击其他处

 

display:block,none,inline
block：单独占据一行，与前后不在同一行
block：块对象的默认值。对象之后添加新行。 
none：隐藏对象。隐藏的对象不占据物理空间。
inline：内联对象的默认值。对象后不添加行。


display:none不占据页面空间
visibility:hidden 占据页面空间
type="hidden"  不占据页面空间 


float  可以看出float所占空间大小    width="150px"  

border:1px solid red;

测试一个元素是不是块级标

签:background-color:red;

使几个块级标签在同一行   width="33%"

---------------
绝对定位position
需要至少定位top、left、right、buttom中的一种
不占据页面空间
position:absolute;
top:20px;
left:60px;

相对定位：占据页面空间，
absolute（绝对定位）
从文档流中拖出（不占据页面空间）。
相对于最接近的，使用absolute或relative定位的父级元素进行绝对定位，如果此元素不存在，则相对与页面左上角定位。


relative（相对定位）
在正常文档流中，不可层叠（占据页面空间）。
相对于正常文档中的位置偏移。

fixed（固定定位）
设置为 fixed 的元素，可定位于相对于浏览器窗口的指定坐标。
此元素的位置可通过 "left"、"top"、"right" 以及"bottom" 属性来规定。不论窗口滚动与否，元素都会留在那个位置。


column 浮动

align ：规定 div 元素中的内容的水平对齐方式。
text-align：规定“元素中”的文本的水平对齐方式。

问题：center的边框哪去了？
答案：content是absolute定位，也即是从文档流中拖出来了，不占据页面控件，所有没有把center撑开。