Web开发技术(2)_0302课堂笔记

一、按钮

  1. button

<input type="button" value="点我" />
<!--要关联脚本语言才能使用-->
  1. submit

<form>
    <input type="submit" value="登录/注册" />
</form>
<!--提交按钮,必须要在表单内,作用:提交表单内的所有数据到服务器-->
  1. reset

<form>
    <input type="reset" value="取消">
</form>
<!--重置按钮,必须要在表单内,作用:重置所在表单内的所有控件-->

二、下拉菜单

请选择你的性别:
<br/>
<br/>
<select>
    <option>--请选择--</option>
    <option>男</option>
    <option>女</option>
</select>

三、总练习

<form>
    <table width="1200" border="1" align="center">
        <tr height="40">
            <td width="30%" align="right">请输入账号:</td>
            <td width="40%">
                <input type="text" size="50" placeholder="账号" />
            </td>
            <td width="30%">
                <font color="red">*</font>
            </td>
        </tr>
        <tr height="40">
            <td align="right">请输入密码:</td>
            <td>
                <input type="text" size="50" placeholder="密码" />
            </td>
            <td>
                <font color="red">*</font>
            </td>
        </tr>
        <tr height="40">
            <td align="right">请确认密码:</td>
            <td>
                <input type="text" size="50" placeholder="再次输入密码" />
            </td>
            <td>
                <font color="red">*</font>
            </td>
        </tr>
        <tr height="40">
            <td align="right">请输入QQ:</td>
            <td>
                <input type="text" size="50" placeholder="QQ" />
            </td>
            <td>
                <font color="red">*</font>
            </td>
        </tr> 
        <tr height="40">
            <td align="right">请输入姓名:</td>
            <td>
                <input type="text" size="50" placeholder="姓名" />
            </td>
            <td>
                <font color="red">*</font>
            </td>
        </tr>
        <tr height="40">
            <td align="right">请输入年龄:</td>
            <td>
                <input type="text" size="50" placeholder="年龄" />
            </td>
            <td>
                <font color="red">*</font>
            </td>
        </tr>
        <tr height="40">
            <td align="right">请输入籍贯:</td>
            <td>
                <input type="text" size="50" placeholder="籍贯" />
            </td>
            <td>
                <font color="red">*</font>
            </td>
        </tr>
        <tr height="40">
            <td align="right">请输入性别:</td>
            <td>
                <select>
                    <option>--请选择--</option>
                    <option>男</option>
                    <option>女</option>
                </select>
            </td>
            <td>
                <font color="red">*</font>
            </td>
        </tr>
        <tr height="40">
            <td align="right">请上传头像:</td>
            <td>
                <input type="file" />
            </td>
            <td>
                <font color="red">*</font>
            </td>
        </tr>
        <tr height="40">
            <td align="right">自我介绍:</td>
            <td>
                <textarea cols="80" rols=6>这个人超级好</textarea>
            </td>
            <td>
                <font color="red">-</font>
            </td>
        </tr>
        <tr height="40">
            <td colspan="3" align="center">
                <input type="submit" value="注册" />
                <input type="reset" value="取消" />
            </td>
        </tr>
    </table>
</form>