美文网首页
HTML-表单综合练习

HTML-表单综合练习

作者: 测试探索 | 来源:发表于2022-05-29 10:39 被阅读0次

本章用table进行布局和升级

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<form action="" method="get">
    <table border="0" width = "500px">
        <tr>
            <td align = "right">请输入用户名:</td>
            <td><input type = "text" name = "" id = ""></td>
        </tr>

        <tr>
            <td align = "right">请输入密码:</td>
            <td><input type = "text" name = "" id = ""></td>
        </tr>

        <tr>
            <td align = "right">再次输入密码:</td>
            <td><input type = "text" name = "" id = ""></td>
        </tr>

        <tr>
            <td align = "right">性别:</td>
            <td>
                <!--checked = "checked" 默认选中-->
                <input type = 'radio' name = "xb" id = "" value = "1" checked="checked">男
                <input type = 'radio' name = "xb" id = "" value="0">女
            </td>
        </tr>

        <tr>
            <td align = "right">兴趣爱好:</td>
            <td>
                <input type = 'checkbox' name = "xb" id = "" value="1">
                游泳
                <input type = 'checkbox' name = "xb" id = "" value="2">
                看书
                <input type = 'checkbox' name = "xb" id = "" value="2">
                爬山
                <input type = 'checkbox' name = "xb" id = "" value="2">
                思考
            </td>
        </tr>

        <tr>
            <td align = "right">生日:</td>
            <td>
                <select>
                    <!--selected = "selected"参数表名下拉默认选中-->
                    <option value="1995">1995</option>
                    <option value="1996">1996</option>
                    <option value="1997" selected = "selected">1997</option>
                    <option value="1998">1998</option>
                    <option value="1999">1999</option>
                    <option value="2000">2000</option>

                </select>年

                <select>
                    <!--selected = "selected"参数表名下拉默认选中-->
                    <option value="1">1</option>
                    <option value="2">2</option>
                    <option value="3">3</option>
                    <option value="4">4</option>
                    <option value="5">5</option>

                </select>月

                <select>
                    <!--selected = "selected"参数表名下拉默认选中-->
                    <option value="1">1</option>
                    <option value="2">2</option>
                    <option value="3">3</option>
                    <option value="4">4</option>
                    <option value="5">5</option>

                </select>日
            </td>
        </tr>

        <tr>
            <td align = "right">头像:</td>
            <td>
                <img src = "image/3.png">
            <select>
                <option value="1">1</option>
                <option value="2">2</option>
            </select>
            </td>
        </tr>

        <tr>
            <td align = "center" colspan="2">
                <input type="button" value = "普通按钮">
                <input type="submit" value = "提交按钮">
            </td>

        </tr>
    </table>
</form>

</body>
</html>
image.png

相关文章

  • HTML-表单综合练习

    本章用table进行布局和升级

  • 表单综合练习

  • html-表单

    功能 表单用于向服务器传输数据,实现web与服务器的交互 表单能够包含input系列标签,比如文本字段、复选框、单...

  • HTML-表单

    一、表单介绍 二、控件的常用属性 三、表单的其他控件

  • HTML-表单

    概述: 标签用于为用户输入创建 HTML 表单. 表单用于向服务器传输数据. 表单能够包含input 元素,比如文...

  • HTML-表单(form)

    表单用于搜集不同类型的用户输入。即是允许用户在表单中(比如:文本域、下拉列表、单选框、复选框等等)输入信息的元素。...

  • 六 HTML-表单

    一、表单概述 1、作用: 用于为用户创建 HTML 表单,用于向服务器传输数据。 表单能够包含 input 元素,...

  • html-图片/表格/表单

    a标签的认识 ’#‘号跳转页面内锚点跳转外部网页跳转内部网页 a标签的伪协议 img的认识 img是一个单标签 ...

  • H5竖屏模板

    【html-头部】 【html-内容区】 为了...

  • HTML-表单form-2018.07.05

    HTML表单学习整理 重点:记住命令单词 难点:要有基本的自己的表单样式的逻辑 form标签基本框架格式: 基本框...

网友评论

      本文标题:HTML-表单综合练习

      本文链接:https://www.haomeiwen.com/subject/nstwprtx.html