HTML5 form表单属性``` ``` ```表单属性用户名: 例如：dzm邮件:电话:提交```

<style>
  form{
    width: 100%;
    max-width: 640px;
    min-width: 320px;
    margin: 0 auto;
    font-family: "Microsoft Yahei";
    font-size: 20px;
  }
  input{
    display: block;
    width: 100%;
    height: 30px;
    margin: 10px 0;
  }
</style>

<!-- 
    placeholder: 提示文字（占位符）
    autofocus: 自动获取焦点
    autocomplete: 自动完成（填充）no 开始（默认）off 取消自订下拉提示之前输入过的
    required: 必填
    multiple: 多选
    novalidate: 关闭表单默认的验证功能，只能加给 form 标签有效
    pattern: 自定义正则验证
 -->

<!-- <form action="" novalidate> -->
<form action="">
   <fieldset>

      <!-- 表单标题 -->
      <legend>表单属性</legend>

      <!-- 用户名 -->
      <label for="username">
        用户名: <input type="text" name="username" id="username" placeholder="例如：dzm" autocomplete="off"  autofocus required>
      </label>

      <!-- 邮件 -->
      <label for="email">
        邮件: <input type="email" name="email" id="email">
      </label>

      <!-- 电话 -->
      <label for="tel">
        电话: <input type="tel" name="tel" id="tel" pattern="1\d{10}">
      </label>

      <!-- 上传文件 -->
      <input type="file" name="file">

      <input type="submit" value="提交">

   </fieldset>
</form>