如何制作网页的顶部和底部？

本文笔记基于「千古壹号」的GitHub项目：https://github.com/qianguyihao/web

目录

1.引入外链设置

2.css通用设置

3.顶部导航

4.banner图

5.搜索框部分

6.搜索框下面部分

7.“多快好省”等口号

8.购物指南

9.地图

10.其他

---

 

基本div设置思路，从上到下，从左到右，层层嵌套，主要div框架如下：

1.引入外链设置

• 在head标签内引入

• <link rel="stylesheet" href="css/base.css">   //导入css代码

• <link rel="shortcut icon" href="favicon.ico">  //导入JD图标，效果如下：

2.css通用设置

• 初始化

@charset "UTF-8";
/*css 初始化 */
html, body, ul, li, ol, dl, dd, dt, p, h1, h2, h3, h4, h5, h6, form, fieldset, legend, img { margin:0; padding:0; }
fieldset, img,input,button { border:none; padding:0;margin:0;outline-style:none; } 

代替通用的  * 设置，默认初始边距和框宽均为0，去掉轮廓

• 清除浮动