当前位置:Gxlcms > html代码 > html中表单标签的type属性的应用实例

html中表单标签的type属性的应用实例

时间:2021-07-01 10:21:17 帮助过:61人阅读

本篇文章给大家带来的内容是关于html中表单标签的type属性的应用实例,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

<input/>单标签
<input type="text(文本)"/>

type属性:

  1. text (单行文本输入框)

  2. password(密码输入框)

  3. radio(单选按钮)

  4. checkbox(复选框)

  5. button (普通按钮)

  6. submit(提交按钮)

  7. reset(重置按钮)

  8. image(图像形式的提交按钮)

  9. file(文件域)
    name 自定义 控件名称
    value 自定义 input控件中的默认文本值
    size 正整数 input 控件在页面中的显示宽度
    checked checked 定义选择控件默认被选中的项
    maxlength 正整数 控件允许输入的最多字符数

<!DOCTYPE html><html lang="en"><head>
    <meta charset="UTF-8">
    <title>表单设置</title></head><body>
    <table width="500" border="0" cellpadding="0" cellspacing="0" align="center">
        <caption><h3 style="color: pink;">青春不常在,抓紧谈恋爱</h3></caption>
        <tr height="60">
            <td>性别</td>
            <td style="color: blue;">
                <img src="boy.jpg" />男<input type="radio"  name="sex" />
                <img src="girl.jpg" />女<input type="radio" name="sex" />
            </td>
        </tr>
        <tr height="60">
            <td>生日</td>
            <td>
                <select name="" id="">
                    <option value="">选择年份</option>
                    <option value="">142</option>
                    <option value="">2234</option>
                    <option value="">3342</option>
                    <option value="">2124</option>
                </select>
                <select name="" id="">
                    <option value="">选择月份</option>
                    <option value="">1月份</option>
                    <option value="">2月份</option>
                    <option value="">3月份</option>
                    <option value="">2月份</option>
                </select>
                <select name="" id="">
                    <option value="">选择日</option>
                    <option value="">1号</option>
                    <option value="">2号2</option>
                    <option value="">3号</option>
                    <option value="">2号1</option>
                </select>
            </td>
        </tr>
        <tr height="60">
            <td>所在地区</td>
            <td >
                <input type="text" value="北疆" style="color:gray;" />
            </td>
        </tr>
        <tr height="60">
            <td>所在地区编码</td>
            <td >
                23 <input type="checkbox" />
                34 <input type="checkbox" />
                56 <input type="checkbox" />
                67 <input type="checkbox" />
            </td>
        </tr>
        <tr height="60">
            <td>用户名</td>
            <td >
                <input type="text" />
            </td>
        </tr>
        <tr height="60">
            <td>密码</td>
            <td >
                <input type="password" maxlength="6" />//控制最多输入6个字            </td>
        </tr>


        <tr height="60">
            <td>注册</td>
            <td >
                <input type="button" value="注册" />
                <input type="button" value="提交"  />
                <input type="button" value="失败" />
                <input type="image" src="zhuce.jpg" />
            </td>
        </tr>
        <tr height="60">
            <td>上传头像</td>
            <td >
                <input type="flie" >
            </td>
        </tr>
        <tr height="60">
            <td>自我介绍</td>
            <td >
                <textarea width= "500"></textarea><!--多行文本框-->
            </td>
        </tr>
        <tr height="60">
            <td></td>
            <td ><!--图像按钮-->
                <input type="image" src="zhuce.jpg" >
            </td>
        </tr>
        <tr height="60">
            <td></td>
            <td > <!--选择-->
                我同意 <input type="checkbox" />
            </td>
        </tr>
        <tr height="60">
            <td></td>
            <td >
                <ins>我是会员立即注册</ins>
            </td>
        </tr>
        <tr height="60">
            <td></td>
            <td >
                <h3>我承诺</h3> 
                <ul>
                    <li>辅导班v</li>
                    <li>发给你发</li>
                    <li>vfbf</li>
                    <li>房间打开</li>
                </ul>
            </td>
        </tr>
    </table></body></html>

相关推荐:

html strong标签是什么意思?html中strong标签的具体用法介绍

html link标签有什么作用?html link标签的定义及属性介绍

以上就是html中表单标签的type属性的应用实例的详细内容,更多请关注Gxl网其它相关文章!

人气教程排行