html + CSS学习笔记 5. position关键字 +

有的时候我们就想把某张图片放在一个位置上，能改变位置的有margin、padding、text-align、float。但是这些太麻烦了，而且用了margin或者padding后它自己就要占据好大的地方，这时候我们就要用到position了。

实例：

<img src="http://i03.pic.sogou.com/7e35a5be5ef96ed5" style="position: absolute; top: 100px; left:100px">

position: absolute 这句代码的意思是给图片设置为绝对定位。后面的top:100px;和left:200px;的作用就是我想让它放在距离上边100像素距离左边200像素的地方。当然也可以使用right和bottom来设置你想要的位置。

div：可定义文档中的分区或节。可以把文档分割为独立的、不同的部分。简单说法：就比如我们浏览新闻网站的时候，它上面有政治新闻、娱乐新闻、体育新闻等。它们都属于不同的类型。所以程序员制作网页的时候都是把它们分成几大部分。那么<div>呢，就是用来给网页分块布局的。

实例：

<div style='border:solid 1px; position: absolute; top: 1px; left: 20px '>

<h3> this is a header.</h3>

<p>this is a paragraph.</p>

</div>

现在<h3>和<p>元素的父元素就从原来的整个浏览器变成<div>了。这就是<div>的作用，现在它就把它里面的内容就分成了网页中的一部分。

呢，就是用来给网页分块布局的。