HTML 表单元素

1、<input> 元素
2、<select> 元素

<select> 元素定义下拉列表
<option> 元素定义待选择的选项。列表通常会把首个选项显示为被选选项。可以通过 selected 属性来定义预定义选项。

<html>

<body>
    <form action="action_page.php">
        <select name="cars">
            <option value="volvo">Volvo</option>
            <option value="saab">Saab</option>
            <option value="fiat" selected>Fiat</option>
            <option value="audi">Audi</option>
        </select><br />
        <input type="submit">
    </form>
</body>

</html>
3、<textarea> 元素

<textarea> 元素定义多行输入字段(文本域)

<html>

<body>
    <textarea name="message" rows="10" cols="30">
        lsdkfjalsdkfjalsdfjalksjdflaksdjfklajs
    </textarea>
</body>

</html>
4、<button> 元素

<button> 元素定义可点击的按钮。

<html>

<body>
    <button type="button" onclick="alert('Hello World!')">点我</button>
</body>

</html>
5、HTML5 表单元素

HTML5 增加了如下表单元素

  • <datalist>
  • <keygen>
  • <output>

<datalist> 元素为 <input> 元素规定预定义选项列表。用户会在他们输入数据时看到预定义选项的下拉列表。<input> 元素的 list 属性必须引用 <datalist> 元素的 id 属性。

<html>

<body>
    <form action="action_page.php">
        <input list="browsers" name="browser">
        <datalist id="browsers">
            <option value="Internet Explorer"></option>
            <option value="Firefox"></option>
            <option value="Chrome"></option>
            <option value="Opera"></option>
            <option value="Safari"></option>
        </datalist><br />
        <input type="submit">
    </form>
</body>

</html>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 表单元素有哪些 表示了文档中的一个区域,这个区域中包含有交互控制元件,用来像web服务器提交信息 输入文本框,根据...
    夜月行者阅读 2,368评论 3 2
  • 表单: 表单是什么?--表单不是表格 用户可以在其中提供一些数据或信息或选项的html元素。表单通常有...
    定格r阅读 404评论 0 0
  • <form> 元素 元素定义 HTML 表单区间,而这个区间的数据将会被提交给后台。例子: 结果是form标签内的...
    Aleph_Zheng阅读 322评论 0 0
  • 本文介绍关于form表单的一些使用方法网站是如何与用户进行交互的?使用HTML表单。表单用于搜集不同类型的用户输入...
    左冬的博客阅读 1,410评论 1 3
  • PS蒙版使用教程,蒙版就是选框的外部(选框的内部就是选区),在使用photoshop等软件进行图形处理时,我们常常...
    小太阳会发光诺阅读 494评论 0 1