您的位置:首页 > Web前端 > HTML5

html5 input元素写法

2016-12-16 20:19 260 查看
<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

    </head>

    <body>

        <!--form定义一个表单-->

        <form action="" method="get"><!--action指定表单的发送地址(服务器地址)-->

                                    <!-- merhod指表单数据发送到服务器的方法

                                        get数据附在网址之后交给服务器

                                        post数据不会附在网址之后交给服务器

                                    -->

                      

        名称:    <input type="text" name="user" placeholder="请输入密码"  value="" /><br /><br /> <!--type="text"文本框name:识别名称,参数名称 。placeholder:提示信息。value:默认值。-->

        密码:       <input type="password" name="passwoed" placeholder="请输入密码"  value="" maxlength="20"/><br /><br /><!--type="password"密码状态 。maxlength:最大长度-->

        国家:       <input  type="text" readonly="readonly" value="中国" /><!-- readonly:只读 -->

        例如:       <input type="text" disabled="disabled" value="美国"/>   <br /><br /><!--disabled:不可用-->

        邮箱:      <input  type="email" name="email"  required="required"/> <br /><br /> <!--type="email"邮箱状态required:必须填写  -->

        我的网址:      <input type="url" /><br /><br /><!--type="url"网址状态-->

        电话:    <input type="tel" /><br /><br /><!--type="tel"电话号码状态-->

        购买数量:<input type="number" min="7" max="30" /><br /><br />

        音量: <input type="range" min="20" max="90"/><br /><br />

   

        

        

        

                <input type="submit" /><!--type="submit"提交状态,点击即可提交 -->

                <input type="reset" /><!--type="reset"重置按键 -->

              

        </form>

    

    

        <br /><br /><br />

           <!--    电话:<input type="text" name="user"  /><br />-->    

           <!--      <input type="hidden"  value="22" name="xx"/> -->  <!--type="hidden"隐藏字段 -->

           <!--      <input type="image" src="img/笔.png"/> -->        <!--type="image"图片式提交-->

           <!--      <input type="button" value="按键" />-->           <!--type="button"普通按键-->

    </body>

</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  html5 input元素写法