10.2. HTML input 标签

10.2.1. HTML表单的input标签第一课视频教程
10.2.2. HTML表单的input标签第二课视频教程
10.2.3. HTML type 属性
10.2.4. HTML checked 属性
10.2.5. HTML disabled 属性
10.2.6. HTML readonly 属性
input 标签 -- 代表HTML表单的单行输入域
  • input标签是单独出现的,<input />
  • 引用网址:http://www.dreamdu.com/xhtml/tag_input/
  • 属性.
    • common -- 公共属性
    • accesskey -- 表单的快捷键访问方式
    • alt -- 用来替换提交按钮的图片(当在input的src属性定义的图片无法显示时)
    • checked -- 如果是选择型的输入域,代表已经被选择
    • disabled -- 输入域无法获得焦点、无法选择,以灰色显示,在表单中不起任何作用
    • maxlength -- 输入域最多可以输入文字的长度
    • name -- 元素名称
    • readonly -- 输入域可以选择,但是无法修改
    • size -- 输入域的长度
    • src -- 当使用图片来表示按钮时,代表图片的位置(URI)
    • tabindex -- 输入域的"tab"键遍历顺序
    • type -- 输入域的显示方式(分为输入型,选择型,点击型)
    • value -- 输入域的值
  • input,中文"输入"

示例

<form id="dreamdu" action="dreamdu.php" method="post" enctype="multipart/form-data">
    <input id="hiddenField" name="hiddenField" type="hidden" value="hiddenvalue" />
    用户名和密码:
    用户名: <input type="text" id="username" name="username" value="dreamdu" size="15" maxlength="25" />
    密码: <input type="password" id="pass" name="pass" size="15" maxlength="25" />

    网站建设服务:
    注册域名 <input type="radio" value="注册域名" id="service1" name="service" />
    购买空间 <input type="radio" value="购买空间" id="service2" name="service" />
    购买云主机 <input type="radio" value="购买云主机" id="service3" name="service" />
    网站定位与策划 <input type="radio" value="网站定位与策划" id="service4" name="service" />
    网站建设与制作 <input type="radio" value="网站建设与制作" id="service5" name="service" />
    网站推广 <input type="radio" value="网站推广" id="service6" name="service" />
    网站运营 <input type="radio" value="网站运营" id="service7" name="service" />
    SEO服务 <input type="radio" value="SEO服务" id="service8" name="service" />

    个人发展方向:
    游戏人生 <input type="checkbox" value="游戏人生" id="direction1" name="direction1" />
    美工设计  <input type="checkbox" value="美工设计" id="direction2" name="direction2" />
    编程开发 <input type="checkbox" value="编程开发" id="direction3" name="direction3" />
    运营与管理 <input type="checkbox" value="运营与管理" id="direction4" name="direction4" />
    创业 <input type="checkbox" value="创业" id="direction5" name="direction5" />

    照片:
    个性照片上传: <input type="file" id="myimage" name="myimage" size="35" maxlength="255" />
</form>

HTML input 标签示例 -- 可以尝试编辑



  • 教程中有什么不懂的地方?发现教程的错误!对教程有什么建议!快快联系猴子呀dreamdu@163.com,:)
赞助梦之都