HTML&CSS快速入门（二）

坚持每天撰写一点博客，今天发现自己写的快速入门一文章阅读的人并不多，远没有第一篇文章水文看的人多，估计很多人看多了这一类科普文都觉得费劲，还是不费脑子的东西更吸引眼球。那这样的话就要去撰写更有意思，与众不同的东西出来，关键是少写废话。

所有的快速入门文章内容其实都是来自百度前端学院里面的课程任务目标，我是根据上面提供的知识点进行归纳总结并写成文章，即使自己不权威，但是百度自己的东西总是权威的吧

今天要讲的东西包括

HTML语义化

CSS基础

什么是语义化

根据内容的结构化，不加以任何CSS样式的美化，直接用HTML的标签进行页面编写。

呈现出好的内容结构，代码结构。引用别人总结的一句话那就是页面裸奔的时候也能看出来这个页面是在做什么事情。

好的内容结构、代码结构也是方便爬虫进行数据挖掘。

同时，如果按照语义化的模式进行页面的编写，也方便后续的代码维护，升级。

为什么要语义化

裸奔好看

良好的用户体验

有利于SEO，和搜索引擎建立良好沟通，有助于爬虫抓取更多的有效信息：爬虫依赖于标签来确定上下文和各个关键字的权重；

方便其他设备解析

方便后续开发与维护，遵守W3C标准的团队都在遵守这个标准，减少差异化

关于CSS需要介绍的东西

在实际开发使用CSS过程中，要记住一些常用的CSS样式名

举例如下：

1，背景颜色 background-color

2，字体 color

3，背景 background

4，边框 border

5，盒模型 margin padding （Tips：Chrome调试工具里面可以很直观的看到某个元素的盒模型，调试过程可以检查样式）

6，定位 position

上面的内容基本都是最常用的样式，其他的无非是一些微调，根据设计稿进行绘制。

接着是介绍选择器，选择器的用法很多变。作为新手上路的你，记住下面两条信息：

类选择器是用.class来选择，id选择器是用#id来选择。

举例

<input class="box" type="text" .../>

如果要选择上面那个标签，则使用.class

<input class="box" id="mybox" type="text" ../>

如果要通过id来选择上面的标签，则使用#mybox来选择

剩下的就是其他选择器，后面会在知识补充的章节里面补充进来。

在CSS里面还有一点比较重要的就是position和float，这个涉及到排版问题。在排版问题上面，这里面学问就大了。

在下一章节将会讲讲CSS的具体内容以及一些常见的问题。