同步操作将从 easysoft/zui 强制同步,此操作会覆盖自 Fork 仓库以来所做的任何修改,且无法恢复!!!
确定后同步将在后台操作,完成时将刷新页面,请耐心等待。
<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta name="description" content="ZUI,一个简单吸引人的前端框架。"><meta name="author" content="Zentao"><title>ZUI - 开源HTML5跨屏框架</title><link href="../css/zui.min.css" rel="stylesheet"><link href="../css/example.css" rel="stylesheet"><script src="../../assets/jquery.js"></script><script src="../../dist/js/zui.min.js"></script><script src="../assets/js/example.js"></script></head><body><nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"><div class="navbar-header"><button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a class="navbar-brand" href="#">ZUI</a></div><div class="collapse navbar-collapse" id="navbar"><ul class="nav navbar-nav"><li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown"><span id="navbarCurrent">examples</span> <b class="caret"></b></a><ul class="dropdown-menu" role="menu"><li><a href="alerts.html">alerts</a></li><li><a href="article.html">article</a></li><li><a href="breadcrumb.html">breadcrumb</a></li><li><a href="button-groups.html">button-groups</a></li><li><a href="buttons.html">buttons</a></li><li><a href="cards.html">cards</a></li><li><a href="carousel.html">carousel</a></li><li><a href="chosen.html">chosen</a></li><li><a href="collapse.html">collapse</a></li><li><a href="colorset.html">colorset</a></li><li><a href="comment.html">comment</a></li><li><a href="dropdowns.html">dropdowns</a></li><li><a href="forms.html">forms</a></li><li><a href="grid.html">grid</a></li><li><a href="icons.html">icons</a></li><li><a href="input-groups.html">input-groups</a></li><li><a href="kindeditor.html">kindeditor</a></li><li><a href="labels.html">labels</a></li><li><a href="lightbox.html">Lightbox</a></li><li><a href="list-group.html">list-group</a></li><li><a href="list.html">list</a></li><li><a href="modals.html">modals</a></li><li><a href="navbars.html">navbars</a></li><li><a href="navs.html">navs</a></li><li><a href="pager.html">pager</a></li><li><a href="panels.html">panels</a></li><li><a href="popovers.html">popovers</a></li><li><a href="progress.html">progress</a></li><li><a href="tables.html">tables</a></li><li><a href="tabs.html">tabs</a></li><li><a href="textbox.html">textbox</a></li><li><a href="tooltip.html">tooltip</a></li><li><a href="type.html">type</a></li></ul></li><li id="navbarNext"><a href="###">NEXT <i class="icon-angle-right icon-large"></i></a></li></ul></div></nav><article class="article-small"><section class="page-section"><h1 class="header-dividing">内容列表视图</h1><table class="table"><tr><td>头部</td><td>包含当前列表标题</td></tr><tr><td>列表</td><td>多个列表部分请使用<code>section</code></td></tr><tr><td>底部</td><td>底部显示页码及其他提示信息</td></tr></table><p>一般内容列表视图</p><div contenteditable="false" spellcheck="false" class="segment no-padding"><br><ul class="breadcrumb breadcrumb-block"><li><i class="icon-location-arrow icon-muted"></i></li><li><a href="#">Home</a></li><li><a href="#">Library</a></li><li class="active">Data</li></ul><div class="list"><header><div class="pull-right"><div class="btn-group" data-toggle="buttons-radio"><button type="button" class="btn btn-default active"><i class="icon-th-list"></i></button><button type="button" class="btn btn-default"><i class="icon-th"></i></button><button type="button" class="btn btn-default"><i class="icon-th-large"></i></button></div></div><h3><i class="icon-list-ul icon-border-circle"></i> Contents List <small>26 articles</small></h3></header><section class="items items-hover"><div class="item"><div class="item-heading"><div class="pull-right"><a href="###"><i class="icon-pencil"></i> edit</a> <a href="#"><i class="icon-remove"></i> delete</a></div><h4><span class="label label-success">NEW</span> <a href="###">Lorem ipsum dolor sit amet.中文标题测试</a></h4></div><div class="item-content">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi, necessitatibus, animi magni illo vel ducimus quia dolorum modi temporibus iste fugit laudantium minima minus sit debitis. Autem voluptate dolorum saepe!</div><div class="item-footer"><a href="#" class="text-muted"><i class="icon-comments"></i> 243</a> <span class="text-muted">2013年11月11日 16:14:37</span></div></div><div class="item"><div class="item-heading"><div class="pull-right"><a href="###"><i class="icon-pencil"></i> edit</a> <a href="#"><i class="icon-remove"></i> delete</a></div><h4><a href="###">Lorem ipsum dolor sit amet.中文标题测试</a></h4></div><div class="item-content">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi, necessitatibus, animi magni illo vel ducimus quia dolorum modi temporibus iste fugit laudantium minima minus sit debitis. Autem voluptate dolorum saepe!</div><div class="item-footer"><a href="#"><i class="icon-comments"></i> 243</a> <span class="text-muted">2013年11月11日 16:14:37</span></div></div><div class="item"><div class="item-heading"><div class="pull-right"><a href="###"><i class="icon-pencil"></i> edit</a> <a href="#"><i class="icon-remove"></i> delete</a></div><h4><a href="###">Lorem ipsum dolor sit amet.中文标题测试</a></h4></div><div class="item-content">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi, necessitatibus, animi magni illo vel ducimus quia dolorum modi temporibus iste fugit laudantium minima minus sit debitis. Autem voluptate dolorum saepe!</div><div class="item-footer"><a href="#"><i class="icon-comments"></i> 243</a> <span class="text-muted">2013年11月11日 16:14:37</span></div></div><div class="item"><div class="item-heading"><div class="pull-right"><a href="###"><i class="icon-pencil"></i> edit</a> <a href="#"><i class="icon-remove"></i> delete</a></div><h4><a href="###">Lorem ipsum dolor sit amet.中文标题测试</a></h4></div><div class="item-content">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi, necessitatibus, animi magni illo vel ducimus quia dolorum modi temporibus iste fugit laudantium minima minus sit debitis. Autem voluptate dolorum saepe!</div><div class="item-footer"><a href="#"><i class="icon-comments"></i> 243</a> <span class="text-muted">2013年11月11日 16:14:37</span></div></div><div class="item"><div class="item-heading"><div class="pull-right"><a href="###"><i class="icon-pencil"></i> edit</a> <a href="#"><i class="icon-remove"></i> delete</a></div><h4><a href="###">Lorem ipsum dolor sit amet.中文标题测试</a></h4></div><div class="item-content">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi, necessitatibus, animi magni illo vel ducimus quia dolorum modi temporibus iste fugit laudantium minima minus sit debitis. Autem voluptate dolorum saepe!</div><div class="item-footer"><a href="#"><i class="icon-comments"></i> 243</a> <span class="text-muted">2013年11月11日 16:14:37</span></div></div><div class="item"><div class="item-heading"><div class="pull-right"><a href="###"><i class="icon-pencil"></i> edit</a> <a href="#"><i class="icon-remove"></i> delete</a></div><h4><a href="###">Lorem ipsum dolor sit amet.中文标题测试</a></h4></div><div class="item-content">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi, necessitatibus, animi magni illo vel ducimus quia dolorum modi temporibus iste fugit laudantium minima minus sit debitis. Autem voluptate dolorum saepe!</div><div class="item-footer"><a href="#"><i class="icon-comments"></i> 243</a> <span class="text-muted">2013年11月11日 16:14:37</span></div></div></section><footer><ul class="pager"><li class="previous"><a href="#">« 上一页</a></li><li><a href="#">1</a></li><li><a href="#">⋯</a></li><li><a href="#">6</a></li><li class="active"><a href="#">7</a></li><li><a href="#">8</a></li><li><a href="#">9</a></li><li><a href="#">⋯</a></li><li><a href="#">12</a></li><li class="next"><a href="#">下一页 »</a></li></ul></footer></div></div><p>一个更紧凑的视图</p><div contenteditable="true" spellcheck="false" class="segment no-padding"><br><ul class="breadcrumb breadcrumb-block"><li><i class="icon-location-arrow icon-muted"></i></li><li><a href="#">Home</a></li><li><a href="#">Library</a></li><li class="active">Data</li></ul><div class="list list-condensed"><header><div class="pull-right"><div class="btn-group" data-toggle="buttons-radio"><button type="button" class="btn btn-default active"><i class="icon-th-list"></i></button><button type="button" class="btn btn-default"><i class="icon-th"></i></button><button type="button" class="btn btn-default"><i class="icon-th-large"></i></button></div></div><h3><i class="icon-list-ul icon-border-circle"></i> Contents List <small>26 articles</small></h3></header><section class="items items-hover"><div class="item"><div class="item-heading"><div class="pull-right"><a href="###"><i class="icon-pencil"></i> edit</a> <a href="#"><i class="icon-remove"></i> delete</a></div><h4><span class="label label-success">NEW</span> <a href="###">Lorem ipsum dolor sit amet.中文标题测试</a></h4></div><div class="item-content">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi, necessitatibus, animi magni illo vel ducimus quia dolorum modi temporibus iste fugit laudantium minima minus sit debitis. Autem voluptate dolorum saepe!</div><div class="item-footer"><a href="#" class="text-muted"><i class="icon-comments"></i> 243</a> <span class="text-muted">2013年11月11日 16:14:37</span></div></div><div class="item"><div class="item-heading"><div class="pull-right"><a href="###"><i class="icon-pencil"></i> edit</a> <a href="#"><i class="icon-remove"></i> delete</a></div><h4><a href="###">Lorem ipsum dolor sit amet.中文标题测试</a></h4></div><div class="item-content">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi, necessitatibus, animi magni illo vel ducimus quia dolorum modi temporibus iste fugit laudantium minima minus sit debitis. Autem voluptate dolorum saepe!</div><div class="item-footer"><a href="#"><i class="icon-comments"></i> 243</a> <span class="text-muted">2013年11月11日 16:14:37</span></div></div><div class="item"><div class="item-heading"><div class="pull-right"><a href="###"><i class="icon-pencil"></i> edit</a> <a href="#"><i class="icon-remove"></i> delete</a></div><h4><a href="###">Lorem ipsum dolor sit amet.中文标题测试</a></h4></div><div class="item-content">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi, necessitatibus, animi magni illo vel ducimus quia dolorum modi temporibus iste fugit laudantium minima minus sit debitis. Autem voluptate dolorum saepe!</div><div class="item-footer"><a href="#"><i class="icon-comments"></i> 243</a> <span class="text-muted">2013年11月11日 16:14:37</span></div></div><div class="item"><div class="item-heading"><div class="pull-right"><a href="###"><i class="icon-pencil"></i> edit</a> <a href="#"><i class="icon-remove"></i> delete</a></div><h4><a href="###">Lorem ipsum dolor sit amet.中文标题测试</a></h4></div><div class="item-content">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi, necessitatibus, animi magni illo vel ducimus quia dolorum modi temporibus iste fugit laudantium minima minus sit debitis. Autem voluptate dolorum saepe!</div><div class="item-footer"><a href="#"><i class="icon-comments"></i> 243</a> <span class="text-muted">2013年11月11日 16:14:37</span></div></div><div class="item"><div class="item-heading"><div class="pull-right"><a href="###"><i class="icon-pencil"></i> edit</a> <a href="#"><i class="icon-remove"></i> delete</a></div><h4><a href="###">Lorem ipsum dolor sit amet.中文标题测试</a></h4></div><div class="item-content">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi, necessitatibus, animi magni illo vel ducimus quia dolorum modi temporibus iste fugit laudantium minima minus sit debitis. Autem voluptate dolorum saepe!</div><div class="item-footer"><a href="#"><i class="icon-comments"></i> 243</a> <span class="text-muted">2013年11月11日 16:14:37</span></div></div><div class="item"><div class="item-heading"><div class="pull-right"><a href="###"><i class="icon-pencil"></i> edit</a> <a href="#"><i class="icon-remove"></i> delete</a></div><h4><a href="###">Lorem ipsum dolor sit amet.中文标题测试</a></h4></div><div class="item-content">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi, necessitatibus, animi magni illo vel ducimus quia dolorum modi temporibus iste fugit laudantium minima minus sit debitis. Autem voluptate dolorum saepe!</div><div class="item-footer"><a href="#"><i class="icon-comments"></i> 243</a> <span class="text-muted">2013年11月11日 16:14:37</span></div></div></section><footer><ul class="pager"><li class="previous"><a href="#">« 上一页</a></li><li><a href="#">1</a></li><li><a href="#">⋯</a></li><li><a href="#">6</a></li><li class="active"><a href="#">7</a></li><li><a href="#">8</a></li><li><a href="#">9</a></li><li><a href="#">⋯</a></li><li><a href="#">12</a></li><li class="next"><a href="#">下一页 »</a></li></ul></footer></div></div><p>带项目缩略图</p><div contenteditable="false" spellcheck="false" class="segment no-padding"><br><ul class="breadcrumb breadcrumb-block"><li><i class="icon-location-arrow icon-muted"></i></li><li><a href="#">Home</a></li><li><a href="#">Library</a></li><li class="active">Data</li></ul><div class="list"><header><div class="pull-right"><div class="btn-group" data-toggle="buttons-radio"><button type="button" class="btn btn-default active"><i class="icon-th-list"></i></button><button type="button" class="btn btn-default"><i class="icon-th"></i></button><button type="button" class="btn btn-default"><i class="icon-th-large"></i></button></div></div><h3><i class="icon-list-ul icon-border-circle"></i> Contents List <small>26 articles</small></h3></header><section class="items items-hover"><div class="item"><div class="item-heading"><div class="pull-right"><a href="###"><i class="icon-pencil"></i> edit</a> <a href="#"><i class="icon-remove"></i> delete</a></div><h4><span class="label label-success">NEW</span> <a href="###">Lorem ipsum dolor sit amet.中文标题测试</a></h4></div><div class="item-content"><div class="media pull-left"><div class="media-place-holder" style="width:200px;height:100px;line-height:100px">200x100</div></div><div class="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi, necessitatibus, animi magni illo vel ducimus quia dolorum modi temporibus iste fugit laudantium minima minus sit debitis. Autem voluptate dolorum saepe!</div></div><div class="item-footer"><span class="label">tag1</span> <a href="#" class="text-muted"><i class="icon-comments"></i> 243</a> <span class="text-muted">2013年11月11日 16:14:37</span></div></div><div class="item"><div class="item-heading"><div class="pull-right"><a href="###"><i class="icon-pencil"></i> edit</a> <a href="#"><i class="icon-remove"></i> delete</a></div><h4><span class="label label-success">NEW</span> <a href="###">Lorem ipsum dolor sit amet.中文标题测试</a></h4></div><div class="item-content"><div class="media pull-left"><div class="media-place-holder" style="width:200px;height:100px;line-height:100px">200x100</div></div><div class="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi, necessitatibus, animi magni illo vel ducimus quia dolorum modi temporibus iste fugit laudantium minima minus sit debitis. Autem voluptate dolorum saepe!</div></div><div class="item-footer"><span class="label">tag1</span> <a href="#" class="text-muted"><i class="icon-comments"></i> 243</a> <span class="text-muted">2013年11月11日 16:14:37</span></div></div><div class="item"><div class="item-heading"><div class="pull-right"><a href="###"><i class="icon-pencil"></i> edit</a> <a href="#"><i class="icon-remove"></i> delete</a></div><h4><span class="label label-success">NEW</span> <a href="###">Lorem ipsum dolor sit amet.中文标题测试</a></h4></div><div class="item-content"><div class="media pull-right"><div class="media-place-holder" style="width:200px;height:100px;line-height:100px">200x100</div></div><div class="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi, necessitatibus, animi magni illo vel ducimus quia dolorum modi temporibus iste fugit laudantium minima minus sit debitis. Autem voluptate dolorum saepe!</div></div><div class="item-footer"><span class="label">tag1</span> <a href="#" class="text-muted"><i class="icon-comments"></i> 243</a> <span class="text-muted">2013年11月11日 16:14:37</span></div></div><div class="item"><div class="item-heading"><div class="pull-right"><a href="###"><i class="icon-pencil"></i> edit</a> <a href="#"><i class="icon-remove"></i> delete</a></div><h4><span class="label label-success">NEW</span> <a href="###">Lorem ipsum dolor sit amet.中文标题测试</a></h4></div><div class="item-content"><div class="media pull-right"><div class="media-place-holder" style="width:200px;height:100px;line-height:100px">200x100</div></div><div class="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi, necessitatibus, animi magni illo vel ducimus quia dolorum modi temporibus iste fugit laudantium minima minus sit debitis. Autem voluptate dolorum saepe!</div></div><div class="item-footer"><span class="label">tag1</span> <a href="#" class="text-muted"><i class="icon-comments"></i> 243</a> <span class="text-muted">2013年11月11日 16:14:37</span></div></div><div class="item"><div class="item-heading"><div class="pull-right"><a href="###"><i class="icon-pencil"></i> edit</a> <a href="#"><i class="icon-remove"></i> delete</a></div><h4><span class="label label-success">NEW</span> <a href="###">Lorem ipsum dolor sit amet.中文标题测试</a></h4></div><div class="item-content"><div class="media"><div class="media-place-holder" style="height:100px;line-height:100px">200x100</div></div><div class="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi, necessitatibus, animi magni illo vel ducimus quia dolorum modi temporibus iste fugit laudantium minima minus sit debitis. Autem voluptate dolorum saepe!</div></div><div class="item-footer"><span class="label">tag1</span> <a href="#" class="text-muted"><i class="icon-comments"></i> 243</a> <span class="text-muted">2013年11月11日 16:14:37</span></div></div><div class="item"><div class="item-heading"><div class="pull-right"><a href="###"><i class="icon-pencil"></i> edit</a> <a href="#"><i class="icon-remove"></i> delete</a></div><h4><span class="label label-success">NEW</span> <a href="###">Lorem ipsum dolor sit amet.中文标题测试</a></h4></div><div class="item-content"><div class="media"><div class="media-place-holder" style="height:100px;line-height:100px">200x100</div></div><div class="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi, necessitatibus, animi magni illo vel ducimus quia dolorum modi temporibus iste fugit laudantium minima minus sit debitis. Autem voluptate dolorum saepe!</div></div><div class="item-footer"><span class="label">tag1</span> <a href="#" class="text-muted"><i class="icon-comments"></i> 243</a> <span class="text-muted">2013年11月11日 16:14:37</span></div></div></section><footer><ul class="pager"><li class="previous"><a href="#">« 上一页</a></li><li><a href="#">1</a></li><li><a href="#">⋯</a></li><li><a href="#">6</a></li><li class="active"><a href="#">7</a></li><li><a href="#">8</a></li><li><a href="#">9</a></li><li><a href="#">⋯</a></li><li><a href="#">12</a></li><li class="next"><a href="#">下一页 »</a></li></ul></footer></div></div></section></article></body>
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。