首頁 > web前端 > html教學 > html中表單標籤的type屬性的應用實例

html中表單標籤的type屬性的應用實例

不言
發布: 2018-08-20 18:03:43
原創
3114 人瀏覽過

這篇文章帶給大家的內容是關於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 控制項在頁面中的顯示寬度
    checked   checked    定義選擇控制項預設被選取的項目
    maxlength 正整數    控制項允許輸入的最多字元數

  10. <!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屬性的應用實例的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板