正则表达式 – Html5模式属性不匹配电子邮件(user@gmail.com)

这里我有一些电子邮件模式属性的问题…

1)如果我在电子邮件领域提供类似user@gmail.com的输入…

2)它不接受价值并显示“模式不匹配”​​..

帮我解决这个问题….

这是Html的片段

<form name='f1' method="POST" action=""  >     
  <div id="fp">


        <span style="margin-left:-50px">Email:</span>&nbsp;&nbsp;
        <span><input  class="input" type="email" name="Email" placeholder="Enter mailID" required pattern="^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$" ></span><br>


         <input type="submit"  name="submit" value="submit">

   </div>
  </form>

任何建议都可以接受….