HTML5学习_day06(4)--html之固定定位

1.固定定位的定义position:
fixed

它使相对浏览器窗口进行定位的，同样脱离文档流的，可以通过left,right,top,bottom来调整元素所在的位置
就是让该标签一直显示在网页某个位置  无论你怎么滚动界面

2.用户

1.一般用来做页面的导航部分与底部
2.可以用来做网页中插入广告和商业推广
注意：1.我们在使用时候尽量使用在页面的底部，因为他脱离了文档流，也不会对整个页面的布局造成影响。

<p class="p1"><span class="s1"><!</span>DOCTYPE <span class="s1">html></span></p><p class="p1"><span class="s1"><</span>html<span class="s1">></span></p><p class="p1"><span class="s1"><span> </span><</span>head<span class="s1">></span></p><p class="p2"><span class="s1"><span> </span><span> </span><</span><span class="s2">meta </span>charset<span class="s3">=</span><span class="s4">"UTF-8"</span><span class="s1">></span></p><p class="p3"><span class="s1"><span> </span><span> </span><</span><span class="s2">style </span><span class="s5">type</span><span class="s3">=</span>"text/css"<span class="s1">></span></p><p class="p1"><span class="s6"><span> </span><span> </span><span> </span></span>body<span class="s7">{</span></p><p class="p4"><span> </span><span> </span><span> </span><span> </span></p><p class="p5"><span class="s8"><span> </span><span> </span><span> </span><span> </span></span>height<span class="s3">:</span><span class="s8"> </span><span class="s9">1600</span><span class="s10">px</span><span class="s8">;</span></p><p class="p6"><span> </span><span> </span><span> </span><span class="s7">}</span></p><p class="p2"><span class="s7"><span> </span><span> </span><span> </span></span>.div1<span class="s7">{</span></p><p class="p6"><span> </span><span> </span><span> </span><span> </span><span class="s11">width</span><span class="s3">:</span> <span class="s9">200</span><span class="s10">px</span>;</p><p class="p5"><span class="s8"><span> </span><span> </span><span> </span><span> </span></span>height<span class="s3">:</span><span class="s8"> </span><span class="s9">200</span><span class="s10">px</span><span class="s8">;</span></p><p class="p5"><span class="s8"><span> </span><span> </span><span> </span><span> </span></span>background<span class="s3">:</span><span class="s8"> red;</span></p><p class="p5"><span class="s8"><span> </span><span> </span><span> </span><span> </span></span>position<span class="s3">:</span><span class="s8"> </span><span class="s12">fixed</span><span class="s8">;</span></p><p class="p6"><span> </span><span> </span><span> </span><span class="s7">}</span></p><p class="p1"><span class="s7"><span> </span><span> </span></span><span class="s1"></</span>style<span class="s1">></span></p><p class="p1"><span class="s1"><span> </span><span> </span><</span>title<span class="s1">></</span>title<span class="s1">></span></p><p class="p1"><span class="s1"><span> </span></</span>head<span class="s1">></span></p><p class="p1"><span class="s1"><span> </span><</span>body<span class="s1">></span></p><p class="p7"><span class="s1"><span> </span><span> </span></span><!--1.固定定位的定义</p><p class="p7"><span> </span><span> </span>它使相对浏览器窗口进行定位的，同样脱离文档流的，可以通过left,right,top,bottom来调整元素所在的位置</p><p class="p8"><span> </span><span> </span></p><p class="p7"><span> </span><span> </span>2.用户</p><p class="p7"><span> </span><span> </span>1.一般用来做页面的导航部分与底部</p><p class="p7"><span> </span><span> </span>2.可以用来做网页中插入广告和商业推广</p><p class="p7"><span> </span><span> </span>注意：1.我们在使用时候尽量使用在页面的底部，因为他脱离了文档流，也不会对整个页面的布局造成影响。--></p><p class="p3"><span class="s1"><span> </span><span> </span><</span><span class="s2">div </span><span class="s5">class</span><span class="s3">=</span>"div1"<span class="s1">></span></p><p class="p9"><span> </span><span> </span><span> </span><<span class="s2">div</span>></<span class="s2">div</span>></p><p class="p9"><span> </span><span> </span></<span class="s2">div</span>></p><p class="p1"><span class="s1"><span> </span></</span>body<span class="s1">></span></p><p class="p1"><span class="s1"></</span>html<span class="s1">></span></p>