HTML+CSS总结

为什么学习前端

随着互联网发展，前端每天应用在人们的生活中。网页网站、APP、小程序等等，所有界面都需要前端来实现，前端的应用越来越广泛。

学习过程

利用课余时间，一个月的时间内学完了HTML、CSS、HTML5、CSS3的一部分。前端入门相比于其他语言来说相对比较简单，但是在学习过程中发现前端需要学习的东西非常琐碎，需要记忆的东西也比较多，做网页时也要对网页有一个整体的布局。在学习的过程中就会发现，前端的学习相比于刚入门越来越复杂，需要更多地耐心去研究。

最开始先学习了HTML的基础入门，学习了标题、标签、段落、列表、表格、超链接等，制作了课程表（表格的重难点在于行列之间的合并，以及行列之间的内边距与外边距）。

接下来学习了表单，表单包括输入标签、菜单和列表标签、菜单和列表项目标签、文字域标签、菜单和列表项目分组标签。输入标签还有多种属性值，可以输入文字域、密码域、文件域、复选域、按钮等等。要注意每个不同的属性包含的性质，以及不同的显示样式。
根据表单制作了注册信息界面：在写注册界面的要注意每一行列之间的间距，学会使用margin、padding。

学完HTML，接下来就进入CSS的学习。HTML是是用于定义文档内容结构的，将网页内容展现出来。CSS是层叠样式表，用来修饰HTML文档的样式。
先学习了CSS基础的文本样式、CSS选择器，基础知识比较好掌握，后又学习了CSS盒子模型，学习了盒子模型以后就要懂得怎样给网页分块布局，按不同盒子进行代码编写。

CSS的定位我认为是一块重难点，position分为static，relative、absolute、fixed、sticky。
relative 不脱离文档流，参考自身静态位置通过 top,bottom,left,right定位，并且可以通过z-index进行层次分级。
absolute 脱离文档流，通过 top,bottom,left,right 定位。选取其最近的父级定位元素，当父级 position 为 static 时，absolute元素将以body坐标原点进行定位，可以通过z-index进行层次分级。
fixed 固定定位，这里他所固定的对像是可视窗口而并非是body或是父级元素。可通过z-index进行层次分级。
sticky固定定位，结合了fixed和absolute，可以选择想要固定的位置固定。
利用定位的相关知识制作了侧边栏导航条。

CSS中的float也是一大重难点，结合float将网页布局完美的展现出来，网页布局分为很多种，有复杂的也有简单地，将一个网页分开成一块一块的盒子，就可以很好地将网页整齐清晰的排列出来。

HTML5和CSS3是在HTML和CSS上做的更一步的改进，可以更简单方便的实现某些功能。

最后根据学习了一个月的知识，尽自己最大可能实现了淘宝的静态页面。





在完成淘宝静态页面的过程中其实并不容易，也是我 第一次自己独立完成一个这么长的代码。完成一个完整的页面，事先一定要将块分好，将大致布局写好，不要写完一大部分后再添加块，这样会造成代码的大量修改，有可能直接将布局破坏掉。写代码的过程中一定要细致，一个小错误发现不了就会造成长时间的时间消耗。整个网页中，我认为最难的地方就是浮动和定位，如果浮动没有使用好就会造成页面块位置的错乱，我现在对于浮动和定位这一模块掌握的还是比较的浅，需要更多地时间去研究。
虽然每天固定课程也挺多，但是尽量在课余时间去学习更多地知识充实自己。现在的水平还很差，许多学了的东西掌握的也没有很好，还有许多没有学到的东西，还需要花费更多地时间去提升自身水平，争取做到更好。