css位置定位position的absolutive,relative,fixed讲解及锚点链接演示

absolutive:

其位置相对于最近的已定位父元素而言的位置,若父级都没有定位,则以html(根元素)可直接指定 “left”、“top”、“right” 以及 “bottom” 属性。若是以html为定位(即以四个角为坐标轴原点,具体哪个点,取决于你的赋值.

1.left和top则表示以左上角为坐标轴原点.

2.left和bottom表示以左下角为坐标轴原点

3.right和top表示以右上角为坐标轴原点

4.right和bottom表示以右下角为坐标轴原点

 注意:它是浮动的,脱离文档流(即会改变原来的排序)

若right=0,bottom=0表示该模块在当前界面的右下角位置,但若界面过长,当你滚动滚轮会发现,它只是在你

刚刚界面的右下角挂着,会被滚轮滚上去.这也是和fixed的区别,fixed是会一直让你的模块处于屏幕的某位置

不会因为滚轮的滚动,改变位置.

relative:

是相对于自己之前的位置的左上角进行操作 注意:浮动,不会影响原文档流

fixed:

同absolutive一样,fixed是会一直让你的模块处于屏幕的某位置不会因为滚轮的滚动,改变位置.


描点链接

 比如当你访问网页,将网页拖到最下面有个置顶按钮,会快速返回首页.

 <div class="head"  id="head"></div>

<a href="#head">返回顶部</a>

用的还是连接公式,只是href不是网址,是你首模块的id.若你首模块div的id为head,则这里的href则用#head(必须要#号)



展开阅读全文

没有更多推荐了,返回首页