固顶(底)及定位
Bootstrap是一个流行的前端框架,可以通过其固定顶底功能和定位类来轻松实现网站建设、网页设计、网站开发、小程序、独立站和跨境电商等各种项目中的布局和交互效果。这些特性使得开发者能够更加高效地实现网页的各种需求,并提高用户的体验感和网站的可用性。

使用下面这些样式方法可以快速对远素的位置进行设定,包括固顶、固底以及定位。

通用属性

使用.position-*样式,可以实现快速定位-虽然它们不包含响应式支持。

<div class="position-static">...</div>
<div class="position-relative">...</div>
<div class="position-absolute">...</div>
<div class="position-fixed">...</div>
<div class="position-sticky">...</div>

固定在top顶部

将一个元素固定在可见区域的顶部,从边到边的对齐,用户在使用固定在顶部时请确认效果带来的影响(如覆盖)-必要时增加额外的自定义CSS。

<div class="fixed-top">...</div>

固定在bottom底部

将一个元素固定在可见区域的底部,从边到边的对齐,用户在使用固定在底部时请确认效果带来的影响(如覆盖)-必要时增加额外的自定义CSS。

<div class="fixed-bottom">...</div>
<div class="sticky-top">...</div>

加入 DEVDIY 开发者社区

利用 DEVDIY 资源快速拓展您的业务
有兴趣与 DEVDIY 开发者合作吗?