小白学框架(前端)。。。

此篇博客只是为了逼自己学习 并无无其他用途 （ps:算是一种打卡吧

效果图👇

代码如下

		<div class="layui-form-item">
			<label class="layui-form-label">输入框</label>
			<div class="layui-input-inline">
				<input type="text" name="title" required="required" lay-verify="required" placeholder="亲输入标题" autocomplete="off"
				 class="layui-input" />
			</div>
		</div>

		<div class="layui-form-item">
			<label class="layui-form-label">密码框</label>
			<div class="layui-input-inline">
				<input type="password" name="pwd" required="required" lay-verify="required" placeholder="请输入密码" autocomplete="off"
				 class="layui-input" />
			</div>
			<div class="layui-form-mid layui-word-aux">辅助文字</div>
		</div>

		<div class="layui-form-item">
			<label class="layui-form-label">选择框</label>
			<div class="layui-input-inline">
				<select name="lin" lay-verify="required">
					<option value=""></option>
					<option value="1">北京</option>
					<option value="2">上海</option>
					<option value="3">杭州</option>
				</select>
			</div>

		</div>

		<div class="layui-form-item">
			<label class="layui-form-label">复选框</label>
			<div class="layui-input-inline">
				<input type="checkbox" name="like[write]" title="写作" />
				<input type="checkbox" name="like[baskerball]" title="篮球" checked="checked" />

			</div>
		</div>

		<div class="layui-form-item">
			<label class="layui-form-label">开关</label>
			<div class="layui-input-inline">
				<input type="checkbox" name="switch" lay-skin="switch" />
			</div>
		</div>

		<div class="layui-form-item">
			<label class="layui-form-label">单选框</label>
			<div class="layui-input-inline">
				<input type="radio" name="sex" value="男" title="男" />
				<input type="radio" name="sex" value="女" title="女" checked="checked" />
			</div>
		</div>

		<div class="layui-form-item layui-form-text">
			<label class="layui-form-label">文本域</label>
			<div class="layui-input-block">
				<textarea class="layui-textarea" name="text" placeholder="请输入内容"></textarea>
			</div>
		</div>

		<div class="layui-form-item">
			<div class="layui-input-block">
				<button class="layui-btn lay-submit lay-filter=" Demo">立即提交</button>
		 <button type="reset" class="layui-btn layui-btn-primary">重置</button>
			</div>
		</div>
	</form>
</body>
<script>
	layui.use('form', function() {
		var form = layui.form;
	});
</script>

就这样吧 溜了溜了