表单类型

作者: 琪33 | 来源:发表于2018-04-23 23:44 被阅读0次

h5表单
HTML表单介绍
2019-04-09 表单（5）
2017-07-14
HTML5 表单元素新特性
学习笔记四|事件处理
表单类型
表单、框架
简单介绍 HTML 表单的用法
html表单的用法

<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>
</head>
<body>
    <!-- type：表单的类型-->
    <form action="">
        <fieldset>
            <legend>表单属性</legend>
            <label for="">
                email: <input type="email" name="email" id=""/>
            </label>
            <label for="">
                url: <input type="url" name="url" />
            </label>
            <label for="">
                number: <input type="number" name="number" step="3" />
            </label>
            <label for="">
                tel: <input type="tel" name="tel" />
            </label>
            <label for="">
                search: <input type="search" name="search" />
            </label>
            <label for="">
                range: <input type="range" name="range" value="100" min="0" max="300"/>
            </label>
            <label for="">
            color: <input type="color" name="color" />
            </label>
            <label for="">
                time: <input type="time" name="time" />
            </label>
            <label for="">
                date: <input type="date" name="date" />
            </label>
            <label for="">
                month: <input type="month" name="month" />
            </label>
            <label for="">
                week: <input type="week" name="week" />
            </label>
            <input type="submit" value="提交"/>
        </fieldset>
    </form>
</body>