html表单基本标签的使用

最新推荐文章于 2022-04-23 20:58:42 发布

liusslove

最新推荐文章于 2022-04-23 20:58:42 发布

阅读量556

点赞数 1

分类专栏： java web 文章标签： html

本文链接：https://blog.youkuaiyun.com/liusslove/article/details/52927288

版权

java web 专栏收录该内容

6 篇文章

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单元素</title>
</head>
<body>
<iframe src="http://www.jb51.net"style="width: 100%">
    当前浏览器不支持嵌入式框架
</iframe>
<!--action提交地址 method提交方式-->
<form action="" method="get">
    <fieldset>
        <legend>标题</legend>
    <div style="width: 500px;height: 500px;overflow: auto">
 <table  border="1" width="500px" cellpadding="0px">
     <tr>
         <!--有一行写了行的宽度，以后每行不用再写-->
         <td width="200px">单行文本输入</td>
         <!--width="*"剩下的部分-->
         <td width="*"><input type="text" id="text" name="text" style="width: 98%"></td>
     </tr>
     <tr>
         <td>密码框</td>
         <td><input type="password" id="pwd" name="pwd" style="width: 98%"></td>
     </tr>
     <tr>
         <td>单选按钮</td>
         <td><input type="radio" id="r1" name="r1" value="男" >男
            <input type="radio" id="r2" name="r2" value="女" >女</td>
     </tr>
     <tr>
         <td>多选按钮</td>
         <td>
             <input type="checkbox" name="book" value="书">书
             <input type="checkbox" name="book" value="画">画
         </td>
     </tr>
     <tr>
         <td>重置表单数据</td>
         <td>
             <input type="reset" value="重置">
         </td>
     </tr>
     <tr>
         <td>文件上传</td>
         <td>
             <input type="file" name="file" >
         </td>
     </tr>
     <tr>
         <td>提交按钮</td>
         <td>
             <input type="submit" name="submit"  value="提交" >
         </td>
     </tr>
     <tr>
         <td>图形按钮</td>
         <td>
             <input type="image" src="../img/a1.png" value="图形按钮">
         </td>
     </tr>

         <td>普通按钮</td>
         <td>
             <input type="button"  value="普通按钮" disabled>
         </td>
     </tr>
     <tr>
         <td>下拉列表</td>
         <td>
            <select>
                <option>北京</option>
                <option>上海</option>
                <option>烟台</option>
            </select>
         </td>
     </tr>
     <tr>
         <td>文本区域</td>
         <td>
             <textarea rows="5" cols="20" οnfοcus="this.value=''">
                 hanying
             </textarea>
         </td>
     </tr>

 </table>
    </div>

    </fieldset>

</form>


</body>
</html>