clayanNEU/form-fields.markdown

## form-fields.markdown

      
    Raw
  

              form-fields.markdown
            
          
    Form fields

A Pen by clayanNEU on CodePen.
License.

  
## index.html
<body>
  <main>
    <h1>Form</h1>
    <form action="success.html" method="get">
      <label>
        Name:
        <input name="name" id="name" type="text" value="clayton"></input>
      </label>
      <br>

      <!-- diff way to link clicking words to the box -->
      <label for="email">Email:</label>
      <input id="email" name ="email" type="email" required placeholder="hello@gmail.com"></input>
      <br>
  <label for="password">Password</label>
  <input id="password" name="password" type="password">
  <br>
  <label for="search">Search</label>
  <input id="search" name="name" type="search" placeholder="&#128269;">
  <br>
  <label for="phone">Phone Number</label>
  <input id="phone" name="phone" type="tel">
  <br>

  <label for="textarea">Text Area</label>
  <textarea id="textarea" name="textarea"
            cols "30" rows "15"></textarea>
  <br>
  <label for="date">Date</label>
  <input id="date" name="date" type="date">
  <br>
  <label for="color">Color</label>
  <input id="color" name="color" type="color">
  <br>
  <label for="file">File</label>
  <input id="file" name="file" type="file" accept="image/*" multiple>
  <br>
  <label for="checkbox">Checkbox</label>
  <input id="checkbox" name="simplecheckbox" type="checkbox" value="The checkbox is checked" checked>
  <br>

  <fieldset>
    <legend>Radio buttons in a fieldset</legend>
    <label for="thisradio">This</label>
  <input id="thisradio" name="radiobutton" type="radio" value="This" checked>
     <label for="orradio">Or</label>
  <input id="orradio" name="radiobutton" type="radio" value="Or">
  </fieldset>
  <br>


      <button type="submit">Sign up</button>


    </form>
  </main>
</body>
	<body>
	<main>
	<h1>Form</h1>
	<form action="success.html" method="get">
	<label>
	Name:
	<input name="name" id="name" type="text" value="clayton"></input>
	</label>
	<br>

	<!-- diff way to link clicking words to the box -->
	<label for="email">Email:</label>
	<input id="email" name ="email" type="email" required placeholder="hello@gmail.com"></input>
	<br>
	<label for="password">Password</label>
	<input id="password" name="password" type="password">
	<br>
	<label for="search">Search</label>
	<input id="search" name="name" type="search" placeholder="🔍">
	<br>
	<label for="phone">Phone Number</label>
	<input id="phone" name="phone" type="tel">
	<br>

	<label for="textarea">Text Area</label>
	<textarea id="textarea" name="textarea"
	cols "30" rows "15"></textarea>
	<br>
	<label for="date">Date</label>
	<input id="date" name="date" type="date">
	<br>
	<label for="color">Color</label>
	<input id="color" name="color" type="color">
	<br>
	<label for="file">File</label>
	<input id="file" name="file" type="file" accept="image/*" multiple>
	<br>
	<label for="checkbox">Checkbox</label>
	<input id="checkbox" name="simplecheckbox" type="checkbox" value="The checkbox is checked" checked>
	<br>

	<fieldset>
	<legend>Radio buttons in a fieldset</legend>
	<label for="thisradio">This</label>
	<input id="thisradio" name="radiobutton" type="radio" value="This" checked>
	<label for="orradio">Or</label>
	<input id="orradio" name="radiobutton" type="radio" value="Or">
	</fieldset>
	<br>


	<button type="submit">Sign up</button>


	</form>
	</main>
	</body>