|
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>display-form</title>
<meta name="viewport" content="initial-scale=1, maximum-scale=1">
<link rel="stylesheet" type="text/css" href="../dist/css/ui.css">
<link rel="stylesheet" type="text/css" href="css/awesome/css/font-awesome.css">
<link rel="stylesheet" type="text/css" href="css/demo.css">
</head>
<body>
<div class="ui-row-flex ui-row-flex-ver">
<div class="ui-col ui-col-auto">
<header class="ui-toolbar">
<a class="ui-icon fa fa-chevron-left ui-fn-left" href="javascript:history.back(-1);"></a>
<a class="ui-icon fa fa-home ui-fn-right" href="index.html"></a>
<h1 class="ui-toolbar-title">表单</h1>
</header>
</div>
<div class="ui-col">
<section id="form">
<div class="demo-desc">
表单输入
</div>
<div class="ui-list ui-list-form">
<ul>
<li class="ui-list-item">
<div class="ui-list-item-inner">
<div class="ui-list-item-label">
用户名:
</div>
<div class="ui-list-item-input-wrap">
<input class="ui-list-item-input" type="text" placeholder="请输入用户名">
</div>
</div>
</li>
<li class="ui-list-item">
<div class="ui-list-item-inner">
<div class="ui-list-item-label">
密码:
</div>
<div class="ui-list-item-input-wrap">
<input class="ui-list-item-input" type="password" placeholder="请输入密码">
</div>
</div>
</li>
<li class="ui-list-item">
<div class="ui-list-item-inner">
<div class="ui-list-item-label">
性别:
</div>
<div class="ui-list-item-input-wrap">
<input class="ui-list-item-input" type="text" placeholder="性别">
</div>
</div>
</li>
<li class="ui-list-item">
<div class="ui-list-item-inner">
<div class="ui-list-item-label">
开关:
</div>
<div class="ui-list-item-input-wrap">
<label class="ui-switch">
<input class="ui-switch-input" type="checkbox" />
</label>
</div>
</div>
</li>
<li class="ui-list-item">
<div class="ui-list-item-inner">
<div class="ui-list-item-label">
内容输入:
</div>
<div class="ui-list-item-input-wrap">
<textarea class="ui-list-item-textarea" placeholder="文本内容"></textarea>
</div>
</div>
</li>
</ul>
</div>
<div class="demo-desc">
表单展示
</div>
<div class="ui-list ui-list-form">
<ul>
<li class="ui-list-item">
<div class="ui-list-item-inner">
<div class="ui-list-item-label">
用户名
</div>
<div class="ui-list-item-input-wrap">
光头强
</div>
</div>
</li>
<li class="ui-list-item">
<div class="ui-list-item-inner">
<div class="ui-list-item-label">
密码
</div>
<div class="ui-list-item-input-wrap">
12345678
</div>
</div>
</li>
<li class="ui-list-item">
<div class="ui-list-item-inner">
<div class="ui-list-item-label">
性别
</div>
<div class="ui-list-item-input-wrap">
男
</div>
</div>
</li>
<li class="ui-list-item">
<div class="ui-list-item-inner">
<div class="ui-list-item-label">
开关
</div>
<div class="ui-list-item-input-wrap">
开
</div>
</div>
</li>
<li class="ui-list-item">
<div class="ui-list-item-inner">
<div class="ui-list-item-label">
内容输入
</div>
<div class="ui-list-item-input-wrap">
用户输入的文本内容用户输入的文本内容用户输入的文本内容用户输入的文本内容用户输入的文本内容
</div>
</div>
</li>
</ul>
</div>
</section>
</div>
<script src="js/lib/requirejs/require.js"></script>
<script src="js/require-config.js"></script>
</body>
</html>
|