HTML的学习标准

很多网页通篇都是<div>，这类网页语义化很差。学习HTML要做到除了会使用标签、属性，还要知道什么时候用什么样的标签，并尽可能的写出语义化的页面。

最开始的时候肯定做不到这些，很多标签一般都是用过之后才能够真正有印象。所以开始上手的时候，可以先找一个网站上已有的简单页面，然后自己用尽可能多的并且合适的标签把它重新写出来。

写语义化页面的好处：越原生的标签加载速度越快，减少css的使用可加快网页加载速度。

块级元素与内联元素

特征：根据文档内容平铺屏幕，创建的块级元素从新行开始，相邻块级元素会在不同行显示。块级元素的width=屏幕宽，height＝内容自适应。

举例：<div>,<p>,<h1>标签

区别：<p>比<div>多"margin＝16px 0px;"的默认样式

相似：<p>和<h1>很相似，<h1>非常像是字体加粗，上下边距增宽后的<p>标签；但<p>通常用于大段文字，而<h1>用于标题。

小贴士：如何查看标签的默认样式？

打开chrom浏览器，command+option+i快捷键调用调试器，调试器中的style样式和盒模型可配合查看标签默认样式。

特征：内容撑开元素，创建的内联元素会在同一行按从左至右的顺序展开，不单独占一行。内联元素的width=内容自适应，height＝内容自适应。

举例：<span>标签

小贴士：块级元素和内联元素在加入css样式后可改变这种差异。当块级元素加入display:inline属性后，若干个块级元素可在同一行显示；同样的，当内联元素加入display:block属性后，每次新创建的内联元素也可实现从新行开始的特征。

特征：含开始标签和结束标签，标签内部可嵌套内容

举例：<div></div>;<span></span>

说明：h5的大部分标签都是双标签

特征：在开始标签内直接结束，不再有单独的结束标签，标签内无嵌套内容

举例：<img/><br/>

虽然第一节课由于网络或者硬件设备的不给力上得有点断断续续，但也学到了很多东西～课下再重新总结一下笔记感觉有了更系统的收获～第一次写技术博客，希望自己再接再厉能够坚持到底～！