H5/Web前端开发教程

3-2. form标签

2017-11-10  本文已影响5人  一Left一

1、form标签

<body>
<!--
form: 是一个复合标签
格式:
<form>
  相关表单元素/标签/标记
</form>
相关元素/标签/标记:
       input: 输入 (文本域,密码域,单选框,复选框),通过type属性进行制定
       非input元素
属性:
    action: 是为了制定把收集的信息发送到的地址, 如果是网络地址一定要加上协议:(http://)

注意点:
    1. 所有表单元素,必须要写在form标签之内
-->

<form action="">

    <!--
     input 标签
     type: 指定输入类型
     value: 设置默认的值
     不会自动换行
     name: 告诉服务器,收集的哪一个信息,只有表单元素具备name属性的时候,才会把相应的信息发送到服务器
    -->

    <!--1,文本域,单行
     type="text"
     type: 指定输入类型
     value: 设置默认的值
     placeholder: 提供默认的提示信息,没有输入文字的,会出现
    -->

    请输入账户: <input type="text" placeholder="务必输入汉语" name="name">
    <!--
    2.密码域:
    type: password
    -->
    <br>
    请输入密码: <input type="password" value="1235456" name="ps">
    <!--
    3. 单选框
    type: radio:收音机
    如果没有指定值,默认就是on/off,为了服务器辨别,指定value值
    注意:要实现单选的功能,要指定name属性相同的值
    -->
    <br>
    性别: 男<input type="radio" name="sex" value="male"> 女<input type="radio" name="sex" value="fmale">
    <!--
    4. 复选框
    type: checkbox
    要指定相同的name值
    如果没有指定值,默认就是on/off,为了服务器辨别,指定value值
    -->
    <br>
    兴趣爱好:
    篮球<input type="checkbox" name="love" value="basketball">
    排球<input type="checkbox" name="love" value="pai">
    乒乓球<input type="checkbox" name="love" value="ping">
    铅球<input type="checkbox" name="love" value="qian">
    选择文件:<input type="file">
    <input type="submit">
</form>
</body>
图片.png

http://www.w3school.com.cn/tags/tag_form.asp
http://www.w3school.com.cn/html/html_forms.asp

上一篇下一篇

猜你喜欢

热点阅读