#推荐
【基础教程】动态面板之固定到浏览器

2024-07-02 0 841

固定到浏览器可以固定动态面板在浏览器中的位置保持不变,仅在浏览器中有效,可以设置水平固定方向、垂直固定方向、始终保持顶层。

【基础教程】动态面板之固定到浏览器
有两个地方可以设置,一是鼠标右键,另一个是右侧样式设置面板

固定到浏览器窗口

勾选之后,开启固定设置,默认水平方向左侧、垂直方向顶部、始终保持顶层

水平固定

  • 会在水平方向上固定元件的位置,无论浏览器宽度如何变化,元件的水平位置不会改变
  • 选择居中时,可以设置距离中部位置的间距,也就是相对于水平居中位置的位移
  • 选择右侧时,可以设置距离右边的边距
  • 有三个选项:左侧、居中、右侧

垂直固定

  • 会在垂直方向上固定元件的位置,无论浏览器高度如何变化,元件的垂直位置不会改变
  • 选择中部时,可以设置距离中部位置的间距,也就是相对于垂直居中位置的位移
  • 选择底部时,可以设置距离底部的边距
  • 有三个选项:顶部、中部、底部

始终保持顶层

勾选之后元件会始终在最顶层显示,相当于一直置顶的功能

常用场景

固定到浏览器功能,具有非常多的使用场景,也是在网站设计中随处可见的常用功能,下面就举几个实际使用的例子
顶部导航栏