代码拉取完成，页面将自动刷新
同步操作将从 deng-dev/materialUI 强制同步，此操作会覆盖自 Fork 仓库以来所做的任何修改，且无法恢复！！！
确定后同步将在后台操作，完成时将刷新页面，请耐心等待。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta content="IE=edge" http-equiv="X-UA-Compatible">
<meta content="initial-scale=1.0, width=device-width" name="viewport">
<title>Form Elements - Material</title>
<!-- css -->
<link href="css/base.min.css" rel="stylesheet">
<!-- favicon -->
<!-- ... -->
<!-- ie -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body class="avoid-fout">
<div class="avoid-fout-indicator avoid-fout-indicator-fixed">
<div class="progress-circular progress-circular-alt progress-circular-center">
<div class="progress-circular-wrapper">
<div class="progress-circular-inner">
<div class="progress-circular-left">
<div class="progress-circular-spinner"></div>
</div>
<div class="progress-circular-gap"></div>
<div class="progress-circular-right">
<div class="progress-circular-spinner"></div>
</div>
</div>
</div>
</div>
</div>
<header class="header">
<ul class="nav nav-list pull-left">
<li>
<a data-toggle="menu" href="#menu">
<span class="icon icon-lg">menu</span>
</a>
</li>
</ul>
<a class="header-logo" href="index.html">Material</a>
<ul class="nav nav-list pull-right">
<li>
<a data-toggle="menu" href="#profile">
<span class="access-hide">John Smith</span>
<span class="avatar"><img alt="alt text for John Smith avatar" src="images/users/avatar-001.jpg"></span>
</a>
</li>
</ul>
</header>
<nav class="menu" id="menu">
<div class="menu-scroll">
<div class="menu-wrap">
<div class="menu-content">
<a class="menu-logo" href="index.html">Material</a>
<ul class="nav">
<li>
<a href="ui-card.html">Cards</a>
</li>
<li>
<a href="ui-collapse.html">Collapsible Regions</a>
</li>
<li>
<a href="ui-dropdown.html">Dropdowns</a>
</li>
<li>
<a href="ui-modal.html">Modals & Toasts</a>
</li>
<li>
<a href="ui-nav.html">Navs</a>
</li>
<li>
<a href="ui-progress.html">Progress Bars</a>
</li>
<li>
<a href="ui-tab.html">Tabs</a>
</li>
<li>
<a href="ui-tile.html">Tiles</a>
</li>
</ul>
<hr>
<ul class="nav">
<li>
<a href="ui-button.html">Buttons</a>
</li>
<li class="active">
<a href="ui-form.html">Form Elements</a>
<span class="menu-collapse-toggle" data-target="#form-elements" data-toggle="collapse"><i class="icon menu-collapse-toggle-close">close</i><i class="icon menu-collapse-toggle-default">add</i></span>
<ul class="menu-collapse collapse in" id="form-elements">
<li>
<a href="ui-form-adv.html">Form Elements <small>(materialised)</small></a>
</li>
</ul>
</li>
<li>
<a href="ui-icon.html">Icons</a>
</li>
<li>
<a href="ui-table.html">Tables</a>
</li>
</ul>
<hr>
<ul class="nav">
<li>
<a href="page-affix.html">Full-Width Page <small>(with fixed LHC/RHC)</small></a>
</li>
<li>
<a href="page-palette.html">Page Palettes</a>
<span class="menu-collapse-toggle collapsed" data-target="#page-palettes" data-toggle="collapse"><i class="icon menu-collapse-toggle-close">close</i><i class="icon menu-collapse-toggle-default">add</i></span>
<ul class="menu-collapse collapse" id="page-palettes">
<li>
<a href="page-palette-blue.html">Blue Palette</a>
</li>
<li>
<a href="page-palette-green.html">Green Palette</a>
</li>
<li>
<a href="page-palette-purple.html">Purple Palette</a>
</li>
<li>
<a href="page-palette-red.html">Red Palette</a>
</li>
<li>
<a href="page-palette-yellow.html">Yellow Palette</a>
</li>
</ul>
</li>
</ul>
</div>
</div>
</div>
</nav>
<nav class="menu menu-right" id="profile">
<div class="menu-scroll">
<div class="menu-wrap">
<div class="menu-top">
<div class="menu-top-img">
<img alt="John Smith" src="images/samples/landscape.jpg">
</div>
<div class="menu-top-info">
<a class="menu-top-user" href="javascript:void(0)"><span class="avatar pull-left"><img alt="alt text for John Smith avatar" src="images/users/avatar-001.jpg"></span>John Smith</a>
</div>
<div class="menu-top-info-sub">
<small>Some additional information about John Smith</small>
</div>
</div>
<div class="menu-content">
<ul class="nav">
<li>
<a href="javascript:void(0)"><span class="icon icon-lg">account_box</span>Profile Settings</a>
</li>
<li>
<a href="javascript:void(0)"><span class="icon icon-lg">add_to_photos</span>Upload Photo</a>
</li>
<li>
<a href="page-login.html"><span class="icon icon-lg">exit_to_app</span>Logout</a>
</li>
</ul>
</div>
</div>
</div>
</nav>
<div class="content">
<div class="content-heading">
<div class="container">
<h1 class="heading">Form Elements</h1>
</div>
</div>
<div class="container">
<section class="content-inner">
<form class="form">
<fieldset>
<legend class="col-lg-10 col-lg-offset-2 col-md-9 col-md-offset-3 col-sm-8 col-sm-offset-4">Basic Form Elements</legend>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="input-color">Input Type = Color</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<input class="form-control" id="input-color" type="color">
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="input-date">Input Type = Date</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<input class="form-control" id="input-date" type="date">
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="input-datetime">Input Type = Datetime</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<input class="form-control" id="input-datetime" type="datetime">
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="input-datetime-local">Input Type = Datetime-local</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<input class="form-control" id="input-datetime-local" type="datetime-local">
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="input-email">Input Type = Email</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<input class="form-control" id="input-email" type="email">
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="input-month">Input Type = Month</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<input class="form-control" id="input-month" type="month">
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="input-number">Input Type = Number</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<input class="form-control" id="input-number" type="number">
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="input-password">Input Type = Password</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<input class="form-control" id="input-password" type="password">
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="input-search">Input Type = Search</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<input class="form-control" id="input-search" type="search">
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="input-tel">Input Type = Tel</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<input class="form-control" id="input-tel" type="tel">
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="input-text">Input Type = Text</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<input class="form-control" id="input-text" type="text">
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="input-time">Input Type = Time</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<input class="form-control" id="input-time" type="time">
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="input-url">Input Type = URL</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<input class="form-control" id="input-url" type="url">
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="input-week">Input Type = Week</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<input class="form-control" id="input-week" type="week">
</div>
</div>
</div>
</fieldset>
<fieldset>
<legend class="col-lg-10 col-lg-offset-2 col-md-9 col-md-offset-3 col-sm-8 col-sm-offset-4">Checkboxes, Radio Buttons & More</legend>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<span class="form-label">Checkbox and Radio</span>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<div class="checkbox">
<label for="input-checkbox-1">
<input id="input-checkbox-1" name="input-checkbox" type="checkbox">Option 1
</label>
</div>
<div class="checkbox">
<label for="input-checkbox-2">
<input id="input-checkbox-2" name="input-checkbox" type="checkbox">Option 2
</label>
</div>
<div class="checkbox">
<label for="input-checkbox-3">
<input id="input-checkbox-3" name="input-checkbox" type="checkbox">Option 3
</label>
</div>
<hr>
<div class="radio">
<label for="input-radio-1">
<input id="input-radio-1" name="input-radio" type="radio">Option 1
</label>
</div>
<div class="radio">
<label for="input-radio-2">
<input id="input-radio-2" name="input-radio" type="radio">Option 2
</label>
</div>
<div class="radio">
<label for="input-radio-3">
<input id="input-radio-3" name="input-radio" type="radio">Option 3
</label>
</div>
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<span class="form-label">Disabled Checkbox and Radio</span>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<div class="checkbox disabled">
<label for="input-checkbox-1-disabled">
<input id="input-checkbox-1-disabled" name="input-checkbox-disabled" type="checkbox" disabled>Option 1
</label>
</div>
<div class="checkbox disabled">
<label for="input-checkbox-2-disabled">
<input id="input-checkbox-2-disabled" name="input-checkbox-disabled" type="checkbox" disabled>Option 2
</label>
</div>
<div class="checkbox disabled">
<label for="input-checkbox-3-disabled">
<input id="input-checkbox-3-disabled" name="input-checkbox-disabled" type="checkbox" disabled>Option 3
</label>
</div>
<hr>
<div class="radio disabled">
<label for="input-radio-1-disabled">
<input id="input-radio-1-disabled" name="input-radio-disabled" type="radio" disabled>Option 1
</label>
</div>
<div class="radio disabled">
<label for="input-radio-2-disabled">
<input id="input-radio-2-disabled" name="input-radio-disabled" type="radio" disabled>Option 2
</label>
</div>
<div class="radio disabled">
<label for="input-radio-3-disabled">
<input id="input-radio-3-disabled" name="input-radio-disabled" type="radio" disabled>Option 3
</label>
</div>
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="input-file">File Select</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<input id="input-file" type="file">
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="input-range">Range</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<input id="input-range" type="range">
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="input-select">Select</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<select class="form-control" id="input-select">
<option>1</option>
<option>2</option>
<option>3</option>
</select>
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="input-select-multi">Select (Multiple)</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<select class="form-control" id="input-select-multi" multiple>
<option selected>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
</select>
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="input-textarea">Textarea</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<textarea class="form-control" id="input-textarea" rows="5"></textarea>
</div>
</div>
</div>
</fieldset>
<fieldset>
<legend class="col-lg-10 col-lg-offset-2 col-md-9 col-md-offset-3 col-sm-8 col-sm-offset-4">Inline Form Controls</legend>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="input-inline">Inline Input Field</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<input class="form-control form-control-inline" id="input-inline" type="text">
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="input-select-inline">Inline Select</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<select class="form-control form-control-inline" id="input-select-inline">
<option> </option>
<option>1</option>
<option>2</option>
<option>3</option>
</select>
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<span class="form-label">Inline Checkbox</span>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<div class="checkbox checkbox-inline">
<label for="input-checkbox-inline-1">
<input id="input-checkbox-inline-1" name="input-checkbox-inline" type="checkbox">Option 1
</label>
</div>
<div class="checkbox checkbox-inline">
<label for="input-checkbox-inline-2">
<input id="input-checkbox-inline-2" name="input-checkbox-inline" type="checkbox">Option 2
</label>
</div>
<div class="checkbox checkbox-inline">
<label for="input-checkbox-inline-3">
<input id="input-checkbox-inline-3" name="input-checkbox-inline" type="checkbox">Option 3
</label>
</div>
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<span class="form-label">Inline Radio</span>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<div class="radio radio-inline">
<label for="input-radio-inline-1">
<input id="input-radio-inline-1" name="input-radio-inline" type="radio">Option 1
</label>
</div>
<div class="radio radio-inline">
<label for="input-radio-inline-2">
<input id="input-radio-inline-2" name="input-radio-inline" type="radio">Option 2
</label>
</div>
<div class="radio radio-inline">
<label for="input-radio-inline-3">
<input id="input-radio-inline-3" name="input-radio-inline" type="radio">Option 3
</label>
</div>
</div>
</div>
</div>
</fieldset>
<fieldset>
<legend class="col-lg-10 col-lg-offset-2 col-md-9 col-md-offset-3 col-sm-8 col-sm-offset-4">Static Form Controls</legend>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<span class="form-label">Static</span>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<p class="form-control-static">Static Form Control Value</p>
</div>
</div>
</div>
</fieldset>
<fieldset>
<legend class="col-lg-10 col-lg-offset-2 col-md-9 col-md-offset-3 col-sm-8 col-sm-offset-4">Validation</legend>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label text-sec" for="text-disable">Disabled Input</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<input class="form-control" id="text-disable" placeholder="Disabled Input" type="text" disabled>
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label text-sec" for="select-disable">Disabled Select</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<select class="form-control" id="select-disable" disabled>
<option>Disabled Select</option>
<option>Option One</option>
<option>Something Else</option>
<option>Another Option</option>
</select>
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label text-sec" for="textarea-disable">Disabled Textarea</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<textarea class="form-control" id="textarea-disable" rows="5" placeholder="Disabled Textarea" disabled></textarea>
</div>
</div>
</div>
<div class="form-group form-group-alt">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="text-alt">Text Input Brand Colour</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<input class="form-control" id="text-alt" placeholder="Text Input Blue" type="text">
<span class="form-help form-help-msg text-alt">Help message<i class="form-help-icon icon">error</i></span>
</div>
</div>
</div>
<div class="form-group form-group-blue">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="text-blue">Text Input Blue</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<input class="form-control" id="text-blue" placeholder="Text Input Blue" type="text">
<span class="form-help form-help-msg text-blue">Help message<i class="form-help-icon icon">error</i></span>
</div>
</div>
</div>
<div class="form-group form-group-green">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="text-success">Text Input Green</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<input class="form-control" id="text-success" placeholder="Text Input Green" type="text">
<span class="form-help form-help-msg text-green">Help message<i class="form-help-icon icon">check</i></span>
</div>
</div>
</div>
<div class="form-group form-group-purple">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="text-purple">Text Input Purple</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<input class="form-control" id="text-purple" placeholder="Text Input Purple" type="text">
<span class="form-help form-help-msg text-purple">Help message<i class="form-help-icon icon">error</i></span>
</div>
</div>
</div>
<div class="form-group form-group-red">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="text-error">Text Input Red</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<input class="form-control" id="text-error" placeholder="Text Input Red" type="text">
<span class="form-help form-help-msg text-red">Help message<i class="form-help-icon icon">error</i></span>
</div>
</div>
</div>
<div class="form-group form-group-yellow">
<div class="row">
<div class="col-lg-2 col-md-3 col-sm-4">
<label class="form-label" for="text-warning">Text Input Yellow</label>
</div>
<div class="col-lg-4 col-md-6 col-sm-8">
<input class="form-control" id="text-warning" placeholder="Text Input Yellow" type="text">
<span class="form-help form-help-msg text-yellow">Help message<i class="form-help-icon icon">warning</i></span>
</div>
</div>
</div>
</fieldset>
<div class="form-group-btn">
<div class="row">
<div class="col-lg-4 col-lg-push-2 col-md-6 col-md-push-3 col-sm-8 col-sm-push-4">
<button class="btn btn-blue waves-button waves-light waves-effect" type="submit">Submit Button</button><button class="btn waves-button waves-effect" type="button">Cancel Button</button>
<hr>
<span class="icon margin-right-sm">link</span><a href="ui-form-default.html">Default Form Elements</a><br>
<span class="icon margin-right-sm">link</span><a href="ui-form-adv.html">Materialised Form Elements</a>
</div>
</div>
</div>
</form>
</section>
</div>
</div>
<footer class="footer">
<div class="container">
<p>Material</p>
</div>
</footer>
<div class="fbtn-container">
<div class="fbtn-inner">
<a class="fbtn fbtn-red fbtn-lg" data-toggle="dropdown"><span class="fbtn-text">Links</span><span class="fbtn-ori icon">add</span><span class="fbtn-sub icon">close</span></a>
<div class="fbtn-dropdown">
<a class="fbtn" href="https://github.com/Daemonite/material" target="_blank"><span class="fbtn-text">Fork me on GitHub</span><span class="fa fa-github"></span></a>
<a class="fbtn fbtn-blue" href="https://twitter.com/daemonites" target="_blank"><span class="fbtn-text">Follow Daemon on Twitter</span><span class="fa fa-twitter"></span></a>
<a class="fbtn fbtn-alt" href="http://www.daemon.com.au/" target="_blank"><span class="fbtn-text">Visit Daemon Website</span><span class="icon">link</span></a>
</div>
</div>
</div>
<script src="http://apps.bdimg.com/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="js/base.min.js"></script>
</body>
</html>
此处可能存在不合适展示的内容，页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容，可点击提交进行申诉，我们将尽快为您处理。
马建仓 AI 助手
