静态网页设计规划

知识点1：完整的网页的布局顺序。

1. 先对网页整体的区域进行划分，划分为多个div区域。
   百度首页由头部的一个文字导航，中减的一个按钮和一个输入框以及下边的文字简介和导航组成（可以先大致设置3个div，即上，中，下三部分）。
   文字导航部分（上）
   按钮和输入框部分（中）
   下面的文字简介和导航组成（下）

2. 对每一块区域进行上色（宽，高，背景颜色），依次调整间距，做出实际的布局效果。

3. 单独去布局每一块区域的内容（按照1,2,3步骤）。

4. Css属性
   盒模型相关的属性：margin，padding，border，width，height。
   文本相关的属性：color，font-size，line-height，font-family，text-dercoration，letter-sacing等
   处理新问题：display:inline-block;vertical-align:top;

---

知识点2：间隙问题的处理？

1. html元素自带的间隙问题。
   解决方案：添加通配选择器，清除元素自带的盒模型结构。
   *{margin:0;padding:0;}

2. 行属性标签以及行内块属性自带间隙问题。
   解决方式1：将分行写的代码放置在同一行写。
   解决方式2：
   a. 将所有的行元素放置在一个div中。
   b. 给div设置字体大小为0的属性。
   c. 将行元素字体设置为想要的字体大小。
   解决方式3：浮动

3. 图片对齐方式的问题。
   解决方案：给图片添加vertical-align属性，默认值是baseline基线对齐，只需要给上其他值即可，vertical-align:top|middle|bottom;
   实现代码（注意：网页结构和样式是分开来写的即外联式）

---