Home  >  Article  >  Web Front-end  >  H5 learning journey-H5 form (11)

H5 learning journey-H5 form (11)

黄舟
黄舟Original
2017-02-17 14:37:141774browse


H5 form elements

form: form

input: input field, the type attribute can set different attributes such as text, password, button, etc.

textarea: text area

lable: control label

fieldset: definition field

legend: title of the field

select: selection list

optgroup: option group

option: option in the drop-down list

button: button

! ! ! ! ! ! ! ! ! ! Code example

<!DOCTYPE html><html lang="en"><head>
    <meta charset="UTF-8">
    <title>H5表格</title></head><body><form>
    用户名:    <br/>
    <input type="text">
    密码:    <input type="password">
    你有喜欢的水果没?    <br/>
    苹果<input type="checkbox">
    西红柿<input type="checkbox">
    香蕉<input type="checkbox">
    <br/>
    请选择您的性别?    <br/>
    男<input type="radio" name="sex">
    女<input type="radio" name="sex">
    <br/>
    请选择您经常去的网站?    <br/>
    <select>
        <option>www.baidu.com</option>
        <option>www.google.com</option>
        <option>www.youku.com</option>
    </select>
    <br/>
    <input type="button" value="按钮">
    <input type="submit"></form>
    <textarea cols="30" rows="30">请在此填写个人信息</textarea></body></html>

! ! ! ! ! Rendering


H5 learning journey-H5 form (11)

H5 form element

form: form

input: input field, The type attribute can set different attributes such as text, password, button, etc.

textarea: text domain

lable: control label

fieldset: definition domain

legend :Title of the field

select: Selection list

optgroup: Option group

option: Options in the drop-down list

button: Button

! ! ! ! ! ! ! ! ! ! Code example

<!DOCTYPE html><html lang="en"><head>
    <meta charset="UTF-8">
    <title>H5表格</title></head><body><form>
    用户名:    <br/>
    <input type="text">
    密码:    <input type="password">
    你有喜欢的水果没?    <br/>
    苹果<input type="checkbox">
    西红柿<input type="checkbox">
    香蕉<input type="checkbox">
    <br/>
    请选择您的性别?    <br/>
    男<input type="radio" name="sex">
    女<input type="radio" name="sex">
    <br/>
    请选择您经常去的网站?    <br/>
    <select>
        <option>www.baidu.com</option>
        <option>www.google.com</option>
        <option>www.youku.com</option>
    </select>
    <br/>
    <input type="button" value="按钮">
    <input type="submit"></form>
    <textarea cols="30" rows="30">请在此填写个人信息</textarea></body></html>

! ! ! ! ! Rendering

H5 learning journey-H5 form (11)

# The above is the content of the H5 learning journey-H5 form (11). For more related content, please pay attention to the PHP Chinese website (www.php.cn)!


Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn