css定位:固定定位

CSS教程

CSS固定定位:了解这种定位差异以及固定位置如何工作。固定定位(position: fixed)的元素会相对于浏览器视窗来定位,这意味着即便页面卷动,它还是会固定在相同的位置,和 relative 一样,我们会使用 top 、 right 、 bottom 和 left 属性来定位。我相信你已经注意到页面右下角的固定定位元素,你现在可以注意看一下,这里有它所使用的 CSS 样式。

.fixed {
  position: fixed;
  bottom: 0;
  right: 0;
  width: 200px;
  background-color: white;
}

固定定位元素不会保留它原本在页面应有的空间,不会跟其他元素的配置互相干扰。令人惊讶的是,行动版装置上的浏览器对 fixed 的支援度比想像的还差很多。

接近10年的互联网从业经验,精通Scrum敏捷软件开发的方法,从事互联网产品设计,开发,测试,运营,案例不少于20个,发现自己最喜欢的工作是做外贸营销,外贸SEO,特别喜欢谷歌优化。从2017年3月开始坚持在群161510483直播谷歌SEO和WEB前端开发技术,只要加进来坚持学习零基础也能够学会。

Last modified: 2019年9月15日

Previous Story

CSS教程

css定位:绝对定位

css绝对定位:absolute应该是最吊诡的position属性值。 absolute 与 fixed 的行为很像,不一样的地方在于 absolute 元素的定位是在他所处上层容器的相对位置。

...

Next Story

CSS教程

CSS剪裁和遮罩

在计算机图形学领域,剪切和掩蔽是两种非常常见的操作。 它们都模糊了视觉元素的一部分,但两者之间有一些差异。 在 …

...