如何利用EasyUI框架的layout控件布局

 时间:2024-10-12 23:47:17

1、第一步,双击打开HBuilder编辑工具,创建静态页面layout.html,默认是HTML5模板,如下图所示:

如何利用EasyUI框架的layout控件布局

2、第二步,引入EasyUI框架的相关JavaScript和CSS文件,除了这些文件之外,还有门钙蹲茌jquery核心文件,注意要先引入jquery文件,如下图所示:

如何利用EasyUI框架的layout控件布局

3、第三步,在body元素标签内插入layout布局div,并设置data-options属性,分别设置不同的区域位置,如下图所示:

如何利用EasyUI框架的layout控件布局

4、第四步,在jQuery初始化函数内调用layout()方法,指定需要调用的容器元素,如下图所示:

如何利用EasyUI框架的layout控件布局

5、第五步,在北方位插入一年四季无序列表,作为区别其他布局位置的内容,如下图所示:

如何利用EasyUI框架的layout控件布局

6、第六步,在南方位插入一年四个季度无序列表以及在东方位插入上下左右无序列表,尽量在每个布局位醅呓择锗置展示不同的内容,如下图所示:

如何利用EasyUI框架的layout控件布局
  • NETCOM-6000-M的功能简介和典型应用
  • Windows server 2008设置启动时的默认系统
  • 如何进行Logstash安装、配置及运维
  • jenkins怎么在jenkins面板上面升级
  • C#winform的线程中如何调用窗体控件
  • 热门搜索
    天下国家手抄报 森林草原防灭火的手抄报 自我介绍手抄报 水的手抄报 春天手抄报图片 小学生手抄报图片 五年级英语手抄报 端午节手抄报模板 我的家乡手抄报 手抄报春节