毕业论文
您现在的位置: 手风琴 >> 手风琴前景 >> 正文 >> 正文

HTML左边栏菜单响应式设计

来源:手风琴 时间:2023/7/24

本节介绍金蜘蛛网页设计器的左边栏菜单(响应式)控件的使用。左边栏菜单(响应式)是一个树形的菜单,可以支持三级树结点,自动适应手机和电脑显示。效果见本站文档的左边的树。如数据库设置左边的树,如下图。

当改小浏览器的宽度至一定值,左边的树会收起为边栏(点左上角的水平箭头也会收起为边栏),如下图:

如上图已收起为边栏,在手机下浏览默认也会收起为边栏(因为手机浏览器宽度小)。这时点左上角的三横按钮,又会展开为树。在电脑上浏览时,鼠标移到连栏里的图标,会弹出对应的菜单。

注意:在使用左边栏菜单时,建议直接从“常用组合组件”-“左边栏菜单(响应式)”-“风格1”或“风格2”创建,然后在此基础上修改为你自己的。

一、右边内容面板的设计

左边的菜单树可能会随着浏览器的宽度收起为边栏或再次展开为树形菜单,这样就要求右边的内容面板也要随着收起为边栏或再次展开为树形菜单改加农炮左边距和大小,不然会在边栏和内容面板之间留下空白。这时只需要把内容面板的属性“id值和name值”的“必有id值”设置为“true”、必有name值设置为“true”,“id值”和“name值”都设置为“ks-main-content”即可。另外,还要把“左边栏菜单面板”的属性“更多属性”-“层级”设置为大于1的值,如10。

二、左边栏菜单面板属性

左边栏菜单面板是一个容器,左边栏菜单项要放在其上面作为子组件。左边栏菜单面板属性如下图:

自定义菜单项宽度

其实就是定义展开成树形菜单时的宽度。

初始化选择菜单从URL中取定位值的关键词。

如下图,我们要直接从网址(

转载请注明:http://www.0431gb208.com/sjsbszl/5588.html