jquery-easyui,easyui组件有哪些,jQuery组件easyui基本布局实现代码

这篇文章主要为大家详细介绍了jQuery easyui基本布局实现代码，具有一定的参考价值，感兴趣的小伙伴们可以参考一下

本文实例为大家分享了

！文档类型超文本标记语言

超文本标记语言

头

meta charset='UTF-8 '

标题基本布局- jQuery EasyUI演示/标题

链接版本='样式表type='text/css' href='./themes/default/easyui.css '

链接版本='样式表type='text/css' href='./themes/icon.css '

link rel='样式表' type=' text/CSS ' href=' demo。' CSS '

脚本类型='text/javascript' src='./jquery.min.js'/script

脚本类型='text/javascript' src='./jquery.easyui.min.js'/script

/头

身体

氘基本布局/h2

p布局包括北，南，东，西，中间，部分/p

div style=' margin:20px 0；'/div

div class=" easy ui-layout " style=' width:700 px；高度：350像素；'

div data-options=' region:' north ' ' style=' height:50px '/div

div data-options='region:'south '，split:true ' style=' height:50px；/div

div data-options='region:'east '，split:true' title='东style=' width:100px；/div

div data-options='region:'west '，split:true' title='西style=' width:100px；/div

div data-options=' region:' center '，title:'Main Title '，iconCls:'icon-ok ' '

table class='easyui-datagrid '

data-options=' URL:' datagrid _ data1。' JSON '，方法：' get '，border:false，singleSelect:true，fit:true，fitColumns:true '

四羟乙基己二酰胺

th data-options=' field:' itemid ' ' width=' 80 '项目ID/th

th data-options='字段：“产品ID”宽度=' 100 '产品ID/th

th data-options='字段：'标价'，align:'右' ' width='80 '价目表价格/th

th data-options='域：'单位成本'，align:'右' ' width='80 '单位成本/th

th数据选项='字段：'属性1 ' '宽度=' 150 '属性/th

th data-options='field:'status '，align:' center ' ' width=' 60 ' Status/th

/tr

/thead

/表格

/div

/body

/html

效果图：

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。