13EasyUI 布局- 为网页创建边框布局
网页 创建 布局 边框
2023-09-11 14:15:41 时间
边框布局(border layout)提供五个区域:east、west、north、south、center。以下是一些通常用法:
- north 区域可以用来显示网站的标语。
- south 区域可以用来显示版权以及一些说明。
- west 区域可以用来显示导航菜单。
- east 区域可以用来显示一些推广的项目。
- center 区域可以用来显示主要的内容。
为了应用布局(layout),您应该确定一个布局(layout)容器,然后定义一些区域。布局(layout)必须至少需要一个 center 区域,以下是一个布局(layout)实例:
<div class="easyui-layout" style="width:400px;height:200px;">
<div region="west" split="true" title="Navigator" style="width:150px;">
<p style="padding:5px;margin:0;">Select language:</p>
<ul>
<li><a href="javascript:void(0)" "showcontent('java')">Java</a></li>
<li><a href="javascript:void(0)" "showcontent('cshape')">C#</a></li>
<li><a href="javascript:void(0)" "showcontent('vb')">VB</a></li>
<li><a href="javascript:void(0)" "showcontent('erlang')">Erlang</a></li>
</ul>
</div>
<div id="content" region="center" title="Language" style="padding:5px;">
</div>
</div>
我们在一个 <div>
容器中创建了一个边框布局(border layout),布局(layout)把容器切割为两个部分,左边是导航菜单,右边是主要内容。
最后我们写一个 onclick 事件处理函数来检索数据,‘showcontent’ 函数非常简单:
function showcontent(language){
$('#content').html('Introduction to ' + language + ' language');
}
相关文章
- 浅谈网络爬虫爬js动态加载网页
- 使用docker mediawiki,搭建网页wiki
- C# Json反序列化 C# 实现表单的自动化测试<通过程序控制一个网页> 验证码处理类:UnCodebase.cs + BauDuAi 读取验证码的值(并非好的解决方案) 大话设计模式:原型模式 C# 深浅复制 MemberwiseClone
- PHP抓取网页获取特定信息
- 微信网页开发之创建Controller(三)
- 如何处理重复网页
- 网页截图工具CutyCapt
- 《Redis实战》一2.3 网页缓存
- 《网站建设与网页设计从入门到精通Dreamweaver+Flash+Photoshop+HTML+CSS+JavaScript》——3.2 创建站点
- 《HTML CSS JavaScript 网页制作从入门到精通 第3版》—— 第02章 HTML基本标记
- 《HTML5 开发实例大全》——1.25 使用< object >元素在网页中显示一个Flash
- Qt编写activex控件在网页中运行
- selenium-java之使用浏览器打开网页举例
- Python实例---模拟微信网页登录(day1)
- android and webview 网页应用
- 零基础Unity做一个中秋诗词鉴赏网页,提前祝您中秋快乐!(DoTween动画 | WebGL视频 | 大文件上传GitHub)
- 网页视频播放器代码大全 + 21个为您的站点和博客提供的免费视频播放器
- PS网页设计教程XXX——在PS中创建一个漫画书主题网页布局
- PS网页设计教程XXVIII——如何在PS中创建一个干净的网页布局
- PS网页设计教程XXVI——如何在PS中创建一个专业的网页布局