Python学习:HTML表单

来源:互联网 发布:日本社交软件 编辑:程序博客网 时间:2024/05/22 22:34

HTML表单用于从客户端收集用户在浏览器中的输入,是HTML实现客户端与服务器交互的核心方法。

一、文本输入

分类 标签 单行文本 <input type="text"> 多行文本 <textarea> 密码框 <input type="password">

二、单项选择

分类 标签 单选按钮 <input type="radio"> 下拉列表 <select>/<option>

三、多项选择

标签:<input type="checkbox">

四、文件上传

标签:<input type="file">

五、边框

标签:<fieldset>

六、集成练习

用户注册界面

<head>    <meta charset="UTF-8">    <title>用户注册</title></head><body>    <from name="input" action="url_from_action">        <fieldset>            <legend>用户注册</legend>            <!----------此处放置所有的输入控件----------->            <table>            <!----------文本输入----------->                <tr>                    <td>用户名:</td>                    <td><input type = "text" name = "name"></td>                    <td>密码:</td>                    <td><input type = "password" name = "pass"></td>                </tr>                <tr>                    <td colspan = "2">备注:</td>                </tr>                <tr>                    <td colspan = "4"><textarea name = "comment" rows = "5" cols = "60"></textarea></td>                </tr>                <!----------单选按钮----------->                <tr>                    <td>性别:</td>                    <td>男性<input type="radio" checked ="checked" name ="Sex" value="male" /></td>                    <td>女性<input type="radio" name="Sex" value="female" /></td>                </tr>                <!----------下拉菜单----------->                <tr>                    <td>学历:</td>                    <td colspan="2">                        <select name="grade">                            <option value="middle_school">高中及以下</option>                            <option value="high_school">专科</option>                            <option value="bachlor" selected="selected">本科</option>                            <option value="master">研究生及以上</option>                        </select>                    </td>                </tr>                <!----------多项选择----------->                <tr>                    <td rowspan="2">兴趣爱好:</td>                    <td>运动:<input type="checkbox" name="sport"></td>                    <td>电影:<input type="checkbox" name="movie"></td>                    <td>音乐:<input type="checkbox" name="music"></td>                </tr>                <tr>                    <td>编程:<input type="checkbox" name="programming"></td>                    <td>下厨:<input type="checkbox" name="cooking"></td>                    <td>旅游:<input type="checkbox" name="tour"></td>                </tr>                <!----------文件上传----------->                <tr>                    <td>头像上传:</td>                    <td><input type="file" name="pic" accept=".png,.jpg,.gif"></td>                </tr>            </table>            <input type="submit" value="提交">        </fieldset>    </from></body>

运行效果图如下:
用户注册界面.PNG

原创粉丝点击