首頁 > web前端 > html教學 > 深入jUI(DWZ)_html/css_WEB-ITnose

深入jUI(DWZ)_html/css_WEB-ITnose

WBOY
發布: 2016-06-24 12:02:41
原創
1334 人瀏覽過

-----------------------------------------------------------------------------主页面index.html <html><header>    #中间加载样式和JS, 静态文件迁移至项目中时要注意路径。    </header><body scroll="no">    <div id="layout">        <div id="header"> # 页面顶部部分                        </div>                     <div id="leftside">    # 左侧导航栏部分            <div id="sidebar_s">    # 伸缩按钮                <div class="collapse">    # collapse则表示所有第一级节点默认为折叠状态                    <div class="toggleCollapse"><div></div></div>                </div>            </div>                        <div id="sidebar">    # 侧菜单部分                <div class="toggleCollapse"><h2>主菜单</h2> <div>收缩</div> </div>                                <div class="accordion" fillSpace="sidebar">                    ----------------------------------------------- # 虚线中间为菜单内容,可替为动态数据                    <div class="accordionHeader">                        <h2><span>Folder</span>用户</h2>                    </div>                    <div class="accordionContent">                        <ul class="tree treeFolder">    # treeFolder:在所有树节点前加上Icon图标                            <li>                                <a href="" target="navTab">用户管理</a>                                <ul>                                    <li><a href="./userlist.html" target="navTab" rel="userlist">用户列表</a></li>                                    <li><a href="./userlist.html" target="navTab" rel="userlist">用户添加</a></li>                                </ul>                            </li>                        </ul>                    </div>                    ------------------------------------------------                </div>                            </div>        </div>                        <div id="container">    #主体部分,多标签页形式                        </div>    </div>            <div id="footer">@author chenwei (www.chenwei.ws) </div> # 页脚部分</body></html>  # 打开所有html文件可以看到,除index.html外,其余均为html代码碎片,它们使用nabTab/dialog形式显示。 ----------------------------------------------------------------------------------- 官方对学习DWZ的几点建议: 1.通读DWZ文档。(PS:东西比较碎,大部分有你想知道的) 2.看demo每个组件演示和代码。(PS:代码碎片可以现用) 3.建议安装firebug,用firebug看html结构,CSS和调试JS。(PS:想了解哪块结构就使用firebug) 4.初学者不建议看DWZ全部源码,非常有必要看看dwz.ui.js和dwz.ajax.js 5.可以从google code下载dwz_thinkphp版本,结合php后台去理解DWZ和服务器端的交互方式
登入後複製

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板