7.0 固定顶部或侧边的导航栏（菜单）

登录

本帖最后由 David.Zhong 于 2021-9-9 17:10 编辑

参照了论坛的帖子：帮你打开活字格更神奇的功能：二十四，左侧上侧导航栏固定 - 活字格专区 - 专题教程 - 葡萄城产品技术社区 (grapecity.com.cn)

上传了案例里面的CSS文件，只固定了左边的导航栏，顶部的还是没固定住，请教大神们怎么改呀。。

David.Zhong · David.Zhong

本帖最后由 Chelsey.Wang 于 2021-7-16 14:57 编辑

配合7.0的流式布局，锁定顶部和侧边的导航栏可以变得更简单哟~

.top{
position: fixed !important;
height: 40px !important;
z-index: 100000;
}
.left{
position: fixed !important;
width: 140px !important;
z-index: 100000;
}

复制代码

width和height分别用于定义所固定元素的宽和高，这个依据自己页面的实际情况来更改就可以啦~

在上传CSS文件中上传上面这段CSS代码

修改对应元素的CSS类名，比如将想要固定的顶部元素，类名设为top

同样将想要固定的侧边栏CSS类名设为left

运行效果如下

demo附上：

wangpenga · wangpenga

本帖最后由 wangpenga 于 2021-6-7 13:57 编辑

能不能把帖子链接给你一下呢

Andyh · Andyh

David.Zhong 发表于 2021-6-7 15:58
配合7.0的流式布局，锁定顶部和侧边的导航栏可以变得更简单哟~demo附上：

感谢大神！请问这方面的教程有吗？想知道怎么实现的

David.Zhong · David.Zhong

Andyh 发表于 2021-6-7 16:25
感谢大神！请问这方面的教程有吗？想知道怎么实现的

非常想直接把教程给你，但是臣妾没有鸭~ 建议多了解一些前端的知识。加油鸭~

Andyh · Andyh

David.Zhong 发表于 2021-6-7 16:40
非常想直接把教程给你，但是臣妾没有鸭~ 建议多了解一些前端的知识。加油鸭~

好的，谢谢

Chelsey.Wang · Chelsey.Wang

感谢大佬支持~

小奇123123 · 小奇123123

Simon.hu · Simon.hu

这个教程可以精华了

yantaoyou521 · yantaoyou521

David.Zhong 发表于 2021-6-6 00:01
配合7.0的流式布局，锁定顶部和侧边的导航栏可以变得更简单哟~

width和height分别用于定义所固定元素的 ...

你好，我的最新版本，完全按你的demo改的，不行啊
运行你的demo就可以，帮我看看吧
截图如下：

		自动登录	找回密码
密码			立即注册

[已处理] 7.0 固定顶部或侧边的导航栏（菜单）

最佳答案

12 个回复

本帖子中包含更多资源

本帖子中包含更多资源

活字格认证

活字格高级认证

微信认证勋章

讲师达人

悬赏达人

圣诞拼拼乐

元老葡萄