类名” pure-form-stacked”用于创建带有标签下方输入元素的堆叠表单。 “pure-form-stacked”类名用于<form>元素和纯表单。
例子
<html>
<head>
<title>The PURE.CSS Default Form</title>
<meta name = "viewport" content = "width = device-width, initial-scale = 1">
<link rel="stylesheet"
href="https://unpkg.com/purecss@1.0.0/build/pure-min.css"
integrity="sha384-nn4HPE8lTHyVtfCBi5yW9d20FjT8BJwUXyWZT9InLYax14RDjBj46LmSztkmNP9w"
crossorigin="anonymous">
<form class="pure-form pure-form-stacked">
<fieldset>
<legend>A Stacked Form</legend>
<label for="email">Email</label>
<input id="email" type="email" placeholder="Email">
<span class="pure-form-message">This is a required field.</span>
<label for="password">Password</label>
<input id="password" type="password" placeholder="Password">
<label for="state">State</label>
<select id="state">
<option>Delhi</option>
<option>UP</option>
<option>Haryana</option>
</select>
<label for="remember" class="pure-checkbox">
<input id="remember" type="checkbox"> Remember me
</label>
<button type="submit" class="pure-button pure-button-primary">Sign in</button>
</fieldset>
</form>
</html>
立即测试
输出
评论前必须登录!
注册