CRM -EasyUI 主界面设计

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/icon.css">
    <script type="text/javascript" src="http://www.jeasyui.com/easyui/jquery.min.js"></script>
    <script type="text/javascript" src="http://www.jeasyui.com/easyui/jquery.easyui.min.js"></script>
</head>
<body class="easyui-layout" style="text-align: left">

    <div data-options="region:‘north‘" style="height: 150px; text-align: center">
    </div>
    <div data-options="region:‘west‘,split:true" title="管理菜单栏" style="width: 200px;">
        <div class="easyui-accordion" data-options="fit:true,border:false">
            <div title="控件使用" data-options="iconCls:‘icon-help‘">
                <ul class="easyui-tree">
                    <li data-options="iconCls:‘icon-help‘" style="padding: 10px"><a href="#"  rel="Article/List.htm">随笔列表</a></li>
                    <li data-options="iconCls:‘icon-help‘" style="padding: 10px"><a href="#"  rel="Article/List.htm">随笔列表</a></li>
                    <li data-options="iconCls:‘icon-help‘" style="padding: 10px"><a href="#"  rel="Article/List.htm">随笔列表</a></li>
                    <li data-options="iconCls:‘icon-help‘" style="padding: 10px"><a href="#"  rel="Article/List.htm">随笔列表</a></li>
                    <li data-options="iconCls:‘icon-help‘" style="padding: 10px"><a href="#"  rel="Article/List.htm">随笔列表</a></li>
                </ul>
            </div>
            <div title="员工管理" data-options="iconCls:‘icon-help‘">
            </div>
            <div title="部门管理" data-options="iconCls:‘icon-help‘">
            </div>
            <div title="质量管理" data-options="iconCls:‘icon-help‘">
            </div>
        </div>
    </div>
    <div data-options="region:‘center‘">
        <div class="easyui-tabs" data-options="fit:true,border:false,plain:true">
            <div title="About" data-options="iconCls:‘icon-help‘,closable:true" style="padding: 10px"></div>
            <div title="About" data-options="iconCls:‘icon-help‘,closable:true" style="padding: 10px"></div>
            <div title="About" data-options="iconCls:‘icon-help‘,closable:true" style="padding: 10px"></div>
            <div title="About" data-options="iconCls:‘icon-help‘,closable:true" style="padding: 10px"></div>
            <div title="About" data-options="iconCls:‘icon-help‘,closable:true" style="padding: 10px"></div>
            <div title="About" data-options="iconCls:‘icon-help‘,closable:true" style="padding: 10px"></div>
            <div title="About" data-options="iconCls:‘icon-help‘,closable:true" style="padding: 10px"></div>
            <div title="About" data-options="iconCls:‘icon-help‘,closable:true" style="padding: 10px"></div>
            <div title="About" data-options="iconCls:‘icon-help‘,closable:true" style="padding: 10px"></div>
            <div title="About" data-options="iconCls:‘icon-help‘,closable:true" style="padding: 10px"></div>
            <div title="About" data-options="iconCls:‘icon-help‘,closable:true" style="padding: 10px"></div>
            <div title="About" data-options="iconCls:‘icon-help‘,closable:true" style="padding: 10px"></div>
            <div title="About" data-options="iconCls:‘icon-help‘,closable:true" style="padding: 10px"></div>
            <div title="About" data-options="iconCls:‘icon-help‘,closable:true" style="padding: 10px"></div>
            <div title="About" data-options="iconCls:‘icon-help‘,closable:true" style="padding: 10px"></div>
        </div>
    </div>
    <div data-options="region:‘south‘,split:true" style="height: 25px; text-align: center;">
        版权所有
    </div>
</body>
</html>
时间: 2024-08-11 06:47:30

CRM -EasyUI 主界面设计的相关文章

Ext JS 6开发实例(三) :主界面设计

在上文中,已经将CMD创建的应用程序导入到项目里了,而且也看到默认的主界面了,今天的主要工作就是修改这个主界面,以符合项目的需要.除了设计主界面,还有一些其他的东西需要配置一下. 添加本地化包 打开app.json文件,找到requires,代码如下:     "requires": [      "font-awesome"     ],12341234 以上代码说明项目默认已经引用了Font Awesome的图标,可以在项目中直接使用.这个在项目的后续开发中会经

WPF登录界面及程序主界面设计

本博文为WPF编写的 管理系统登录界面,及几个管理系统主界面设计   先上图看一下效果 主界面: 图一:登录界面  图片二.登录数据准备中 现在开始上源码: 登录界面前台源码: <Window x:Class="WPFLoginDemo.LoginWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.micro

Winform开发框架主界面设计展示

做了好多年Winform的程序的开发,主窗口的界面设计一般都要求做的更好一些,可以根据不同的系统功能模块进行归类整合,能使客户迅速寻找到相关功能的同时,也能感觉到整体性的美观大方,因此主窗口的界面设计总是会精益求精,力求做到更好用.更美观,这样才能吸引客户使用. 目前的主体界面设计,可以使用很多控件进行美化,这样能使得开发者能够迅速开发好美观的界面,也可以使得界面总体性有一个统一.规范的基准.一般推荐使用DevExpress或者DotNetbar这两款界面控件套件,他们都能设计出类似Office

Winform_devexpress开发框架主界面设计

做了好多年的C#开发,从.Net.Winform及第三方的 DevExpress.无论什么样的系统,主界面的设计及风格无疑非常重要.从客户的角度考虑,要求功能区清晰,整体美观大方,这样才会有可能从第一视觉或印象中吸引客户. 之前也自己做过很多.Net 和Winform的界面框架,接触DevExpress后,感觉色彩搭配及界面整体感觉不错,所以设计出如下界面. DevExpress样式主界面介绍 在WinForm 框架中,界面分多个区展现,简洁易区分,并且可根据需要,对部分功能进行隐藏,使功能界面

jquery+easyui主界面布局一例

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="workbench.aspx.cs" Inherits="WebApp.workbench" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <me

Android ActionBar应用实战,高仿微信主界面的设计

转载请注明出处:http://blog.csdn.net/guolin_blog/article/details/26365683 经过前面两篇文章的学习,我想大家对ActionBar都已经有一个相对较为深刻的理解了.唯一欠缺的是,前面我们都只是学习了理论知识而已,虽然知识点已经掌握了,但是真正投入到项目实战当中时会不会掉链子还很难说.那么不用担心,本篇文章我就将带领大家一起进入ActionBar的应用实战,将理论和实践完美结合到一起. 如果你还没有看过我的前两篇文章,建议先去阅读一下 Andr

会员管理系统的设计和开发(3)--主界面的设计思路分享

会员管理系统经过一段时间的紧锣密鼓开发,软件终于完成并发布.在这期间,碰到了不少技术难点,并积累了不少开发心得和经验,本篇继续介绍这个开发过程中相关的技术要点,本章主要介绍会员管理里面,列表主界面的一些设计思路分享. 有时候,遵循一些固定的套路做事情,总是很容易,如果每个地方搞一些创新和改进,那么往往需要花费很多时间,但是创新是有积极意义的,虽然可能会遇到困难,但是很值得去做.在Winform的界面设计上,虽然我可以使用代码生成工具生成比较标准的界面了,但是我总是喜欢参考学习,并改进一些界面方面

#这个测试程序有助于我们理解wxPython的界面设计,基本的控件和事件调用都有

#!/bin/env python # -*- coding: utf-8 -*- ################################################################################# #这个测试程序有助于我们理解wxPython的界面设计,基本的控件和事件调用都有 ################################################################################# imp

wxWidgets界面设计工具DialogBlocks(转载)

wxWidgets界面设计工具DialogBlocks // * create by zyzx // * 2009-3-12 // * 转载请注明来源:http://www.cppblog.com/zyzx 工欲善其事,必先利其器.在MFC上开发,有VS系列强大的可视化工具,基于wx的开发工具虽然没有VS.QT的界面设计器强大,但在灵活度上VS的界面设计器是没法比的(QT的没有用过,不做评论).          如果选择了wx库,了解几款基于其上的界面设计工具,会大大提高开发效率. 一.wx界