前端 day7

一、margin的用法

1.margin位于盒子（元素）之外

2.margin控制的是同级元素之间的关系

3.margin不会影响盒子本身的大小和宽高

4.给单一方向添加margin值

    margin-left/right/top/bottom

5.margin的设置方法：

            margin:1个值    四周

            margin:2个值    上下、左右

            margin:3个值    上、左右、下

            margin:4个值    上、右、下、左

6.margin可以设置为负值

7.margin常出现的BUG

     1.当父元素和第一个子元素没有加入浮动时，给第一个子元素加入margin-top时，会把父元素也带下来

     2.上下相邻两个元素之间的margin值，不会叠加，按照最大值去设置

     Eg:

8.margin:0 auto; (让当前元素在父元素里居中)

二、网页的制作

1.规划

  1.元素命名：

      id划分外围结构

      版心的命名

      版心内部内容块的命名

2.css外部样式表

1.每个网页都要有自己的样式表

2.每个网站都有自己的公共样式表

3.每个网站都有自己的重置样式表（清除所有默认样式）

4.三个样式表都要写@charset “utf-8”;

   

4.公共样式表（COMMON）

      1.版心外围样式没有颜色平铺，只写版心就行

       2.切片

          Ctrl+alt+shift+s    然后保存

        3.按钮把宽高解析在元素内部，要给按钮加上边框的宽高

 5.首页样式表

          1.导航栏用ul写，写导航步骤：

             浮动/宽高/文本居中

          2.banner图要放在版心里