盒模型主要定义四个区域: 内容(content)、内边距(padding)、边框(border)和外边距(margin)。
注意:CSS内定义的宽度(width)和高度(height), 指的是填充以内的内容范围(即内容高度宽度)。 因此一个元素实际宽度=左边界+左边框+左填充+ 内容宽度+右填充+右边框+右边界。
常见块元素有:div、p、h1—h6、table、ul、ol、li、hr、 pre。它可以 容纳内联元素和其他块元素。如果没有CSS的作用, 块元素会顺序以每次另起一行的方式一直往下排。而有了CSS以后,我们可以改变这种 html的默认布局模式,把块元素摆放到你想要的位置上去。
内联元素只能容纳文本或者其他内联元素,它会依次往后排列内联元素内容,常见内联 元素有:a、input、textarea、select、img、strong、em、span。 块元素与内联元素也可以互相转换:display:block; display:inline;
绝对定位和相对定位:
相对定位:相对于它自己原来的位置进行偏移,设置了position:relative,top和left才有用
绝对定位:绝对定位的参照位置就不像相对那样是自己了,至于是哪个,就看它的上级或上上级有没有定位了,也就是有没有position:relative;或position:fixed了。最后一点,绝对定位是不占位置的,它会像PS的图层一样单独做一层,至于第几层你可以通过z-index:这个属性来设置