web前端：HTML+CSS实现百度首页静态显示

题外话，目前刚接触前端，刚看了HTML和CSS学习的基本内容，百度首页的静态显示作为一个简单练手项目巩固知识点。
1.如何实现一个网站页面的编写
通过一些博主的总结，主要可以分为四点：

1. 网站类型：网站里有什么东西；
2. 布局（排版）：明确页面上每一块是什么，比如左上角的区域，右上角的区域，logo区域，下角区域等；
3. 结构：用html架构代码，从步骤2可知，将每一块写为一个
   元素，在

   中添加内容；
4. 细节：用CSS进行编排。

根据上面的步骤我们就可以完成一个简单的页面显示，通过HTML代码将所需要的内容添加，在用CSS修改细节和排版。下面就开始百度首页静态显示的流程吧！！！

Step1 . 百度首页-图片(这是网上截图的，不是我最后的图哈，我自己实现的界面在最后面!)
Step2. 布局（可以分为哪些块）左、右上角导航栏块，logo+搜索栏块，下角块（网站备案区域）

Step3. 结构，用html中

元素实现Step2中的各个块的内容
（1）左上角的导航栏，包含新闻，hao123，地图，视频，贴吧，学术，更多。
如下代码实现：

（2）右上角的导航栏类似，包含天气，设置，登录。

（3）logo加载，直接在百度官网页面下载原logo图片，使用 元素调用，一般在源码文件夹中创建img文件夹，使用相对路径调用。（***开始没有加最先的那个点，一直未加载出图片，注意!***）

（4）搜索栏，搜索输入框+提交框，采用标签，用于为用户输入创建HTML表单，表单用于向服务器传输数据。

（5）下角区包括两部分，
左下角包括：设为首页，关于百度，About Baidu等；
右下角包括@2020Baidu版本号，经营号，备案号等。

经过步骤3，已经将百度页面简单的内容添加进去了，效果如下所示，在Step4中用CSS对样式进行排版。

Srep4. 细节，用CSS进行编排
（1）左上角导航栏
（2）右上角导航栏
(3)logo
(4)搜索栏
（5）下角两边（但是没在左右去，啊啊啊，我哭了! float属性 position属性左右对齐）



最终结果，实现界面如下

仍然有需要改进的地方，比如鼠标移动到导航栏会有显示改变等，排版格式不好
周末前完成，以结构化的