1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980 |
- <!doctype html>
- <html>
- <head>
- <meta charset="utf-8">
- <title></title>
- <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
- <link rel="stylesheet" href="../style/weui.css"/>
- <link rel="stylesheet" href="../style/weui2.css"/>
- <link rel="stylesheet" href="../style/weui3.css"/>
- <script src="../zepto.min.js"></script>
- <script>
- $(function(){
-
- });
-
- </script>
- </head>
- <body ontouchstart class="page-bg">
- <div class="page-hd">
- <h1 class="page-hd-title">
- css类
- </h1>
- <p class="page-hd-desc">简单的类,可以直接加在到class</p>
- </div>
-
- <table class="weui-table weui-border-tb">
- <thead>
- <tr><th>zepto</th><th>说明</th></tr>
- </thead>
- <tbody>
- <tr><td>page-bg</td><td>灰色页面背景</td></tr>
- <tr><td>page-hd</td><td>四边内边距20px</td></tr>
- <tr><td>page-hd-title</td><td>20号字体,下边距15px,大标题</td></tr>
- <tr><td>page-hd-desc</td><td>14号居上5px,灰色字体,小标题</td></tr>
- <tr><td>page-bd</td><td>4个内边距0,用于容器</td></tr>
- <tr><td>page-bd-15</td><td>0 15px内边距,主体内容</td></tr>
- <tr><td>weui-footer</td><td>版权</td></tr>
- <tr><td>placeholder</td><td>提示文本</td></tr>
- <tr><td>weui-avatar</td><td>一般头像</td></tr>
- <tr><td>baseline middle top</td><td>对齐方式 </tr>
- <tr><td> .block .show .hide .inline .block .dtable .cell</td><td>显示方向</td></tr>
- <tr><td>tleft .tcenter .tright</td><td>文字方向</td></tr>
- <tr><td>center</td><td>居中</td></tr>
- <tr><td>border</td><td>边框 .</td></tr>
- <tr><td>dotted </td><td>虚线 .</td></tr>
- <tr><td>下划线.u 删除线.del 无下划线.non</td><td>手图标.hand 移动图标.move</td></tr>
- <tr><td>斜体.i 非斜体.-i</td><td> 粗体bold 正体.-bold</td></tr>
- <tr><td>不换行 .-wrap 换行.wrap</td><td>浮动.left .right .clear</td></tr>
- <tr><td>清除父浮动 .clearfix</td><td>大写.upper 小写.lower 首字大写.cap</td></tr>
- <tr><td>隐藏.hidden显示.visible</td><td>底层 .zindex</td></tr>
- <tr><td>层显示方式 .rel 漂浮.abs .fixed</td><td></td></tr>
- <tr><td>居左20px .indent</td><td>行高20px .lheight</td></tr>
- <tr><td>点击虚线 .outline</td><td>超过显示... .ell</td></tr>
- <tr><td>雅黑字体 .yahei</td><td>字体大小 .f11-.f35 .f40 .f45 .f50</td></tr>
- <tr><td>字体颜色 .f-red .f-green .f-blue .f-black .f-white .f-gray .f-orange
- 对应.bg-red</td><td></td></tr>
- <tr><td>15px圆角.radius-lg 8px -md 2px -sm 5px .radius</td><td></td></tr>
- <tr><td>模糊 .blur</td><td>边框阴影 .bs</td></tr>
- <tr><td>圆 .circle 反向reverse</td><td>旋转360 .xz360 循环的 xz180不循环</td></tr>
- <tr><td>透明50 .opacity</td><td> 不透明 .opacity-0</td></tr>
- <tr><td>全透明 .opacity-1</td><td></td></tr>
- <tr><td>文字阴影 .ts</td><td>渐变.jb</td></tr>
- <tr><td>边框样式weui-border-</td><td>t b tb l r 默认不带</td></tr>
- <tr><td>.weui-border-radius 4像素</td><td></td></tr>
- <tr><td>weui-table weui-boder</td><td>表格</td></tr>
- <tr><td>动画animated 循环.checked</td><td></td></tr>
- <tr><td>fadeIn fadeOut</td><td>pulse</td></tr>
- <tr><td>rotateIn</td><td>shake swing以上动画配合animated用</td></tr>
- <tr><td>slideIn slideOut weui-loading可单独用</td><td></td></tr>
- <tr><td></td><td></td></tr>
- <tr><td></td><td></td></tr>
- <tr><td></td><td></td></tr>
- <tr><td></td><td></td></tr>
- <tr><td></td><td></td></tr>
- </tbody>
- </table>
- </body>
- </html>
|