当前位置:爱推吧 » Div+CSS » CSS position:fixed固定定位用法实例

CSS position:fixed固定定位用法实例

Position定位属性可以应用于所有的标签,以前一般都用绝对定位(position:absolute)或相对定位(position:relative)来进行排版、布局。关于布局的问题,你可以移步《消除div+css布局之定位与浮动的难点》查看。

对于固定定位(position:fixed)用的比较少,今天在用的时候,发现使用position:fixed,框的大小是随里面内容的多少进行变化,而不管你用的是div或span。而有时候,我们往往需要把应用position:fixed属性的标签表现出来的像div块级元素,而不是随里面的内容变化。其实实现起来也十分的简单。

代码如下:

div{position:fixed;top:0;width:100%;}

上面的代码表示随着浏览器的移动,div框内的元素显示在浏览器的最上方,如本网站所示。这里的关键就是width:100%; 加上width:100%;以后,div才表现的像块级元素一样,占据浏览器的一行。

6 个吐槽 on “CSS position:fixed固定定位用法实例”

    1. 用 div{position:fixed;top:0;width:100%;}
      它是以浏览器为基点进行定位的。
      可以用left/right/top/bottom等表示定位的值

发表评论

电子邮件地址不会被公开。 必填项已用*标注