MARGIN
| margin用法 （外边距、边界） | |
|---|---|
| 1:margin在元素外围，不会撑大元素的大小 | |
| 2:作用:控制元素与元素之间的间距。 | |
| 3：给单一方向添加margin | |
| margin-left/right/top/bottom | |
| 4 :margin设置方法： | |
| margin:30px; 四周 | |
| margin:10px 30px; 上下 左右 | |
| margin:10px 30px 50px 上 左右 下 | |
| margin:10px 30px 50px 100px 上右下左 | |
| 5:margin:0 auto; | |
| 让当前元素在父元素里面左右居中。 | |
| 6:margin常出现的bug | |
| a:两个相邻元素上下的margin值 不会叠加 按照较大值设置。 | |
| b:如果父元素和第一个子元素没有浮动的情况下，给第一个子元素添加margin-top,会错误放在父元素上面。 |
盒子大小计算
盒子在网页中占有的真实空间：
占有的宽度：width+padding-left/right+border-left/right+margin-left/right
占有的高度：height+padding-top/bottom+border-top/bottom+margin-top/bottom
网页规划
1.元素的命名
a.划分外围结构：id选用驼峰式命名法或者语义化。
eg:newsLeft/news
b.版心的命名：连字符命名法。
eg:news-con
内容版快的命名：下划线命名法。
eg:news_left
2.css外部样式表
1.网页尽可能地使用外部样式表。
2.每一个页面都需要有属于自己的样式表。
3.每一个网站都拥有公共样式。
4.每一个网站至少拥有一个重置样式的样式表用来清除所有默认样式。
3.css外部样式表命名示例
index.css(首页样式表）
public.css(公共样式表）
reset.css(重置样式表）
外部样式表首行：[email protected]"utf-8";
首行说明：用来声明样式表所使用的语言。