前端初体验-baidu.com

近十几天的学习，主要是为了完成百度首页的制作，通过尝试制作，发现问题，然后再去学习问题，最后解决问题。

最开始，我先查看百度首页的源代码，大致了解了需要做的几个部分。因为之前也接触过HTML和CSS，在慕课网上学过一点，就复习了之前做的笔记之后，尝试着自己做一做，果然“不负众望”，很难做到和百度一模一样，遇到了很多问题，首先就是结构混乱，其次对一些概念感觉大致知道，但是模糊不清。慢慢的就很难再继续做下去了，我就决定再重新做一下系统的学习，也把之前学过的再巩固一下。

看了从亚飞那拷来的视频，对CSS有了更加系统的认识，哪个标签都对哪些属性，这些属性又有哪些作用和效果，并且学到了一些编写代码时的技巧和习惯。首先需要统筹一下布局，把网页中需要做的分成几部分，这样才能使结构更加清晰。在编写百度首页时，我把需要做的分成了三部分，第一部分，右上角的各个链接；第二部分，中间百度的logo和搜索框；第三部分，下面的二维码和一些说明。

第一部分里主要学到了怎么实现鼠标滑过一个内容出现一个框，利用hover属性，需要注意的是 滑过的那个标签得和出现的标签在同一个盒子里，有同一个父类；还学到了 background-position属性的作用，在显示一张大图中的某小图标时很有用；还学到了cursor属性，可以改变鼠标的形态。

第二部分，设置了一张图，在<form></form>中分别设置了type为“text”的输入框和“submit”的按钮，需要注意的就是需要使用内联，使他们在同一行，还有就是定位，主要用了绝对定位和相对定位，浮动没怎么用；这一部分也有几点和第一部分相似，用到了background-position属性和hover属性。

第三部分，和前两部分所需用的知识点大致相同，一步一步规范的做就行。

 总结一下不足，这个首页还是有瑕疵，右上角设置的那块，滑动出现的框上面没有小角；做的过程中，老是因为命名纠结，有时候没注意名字写错了，效果没出现纠结半天找不到问题，结果发现名字没对应上……更改之后效果就正确出现了；因为之前学的很碎片化，知识面并不是很广，一些规则和注意事项不是很了解，需要更加系统的学习。