zoukankan      html  css  js  c++  java
  • 表单的制作练习

    表单练习

    注册信息表单

    用户名:
    密   码:

    性   别:

    爱   好:

    籍贯:

    个人简介:

    头像或文件:


    <!DOCTYPE HTML>
    <html>
    	<head>
    		<meta charset="utf-8">
    		<title>表单练习</title>
    	</head>
    	<body>
    		<h1>注册信息表单</h1>
    		<form action="#" method="POST" enctype="multipart/form-data">
    			<!--用户名和密码-->
    			<p>
    			用户名:<input type="text" name="usename" placeholder="请输入用户名" required autofocus maxlength="20" size="20"/><br/>
    			密   码:<input type="password" name="password" placeholder="请输入密码" maxlength="20" size="20"/><br/>
    			</p>
    			<!--兴趣和爱好-->
    			<p>
    			性   别:<label><input type="radio" name="sex" value="0" checked/>男</label>
    				   <label><input type="radio" name="sex" value="1"/>女</label><br/>
    			</p>
    			<p>
    			爱   好:<label><input type="checkbox" name="like[]" value="sing"/>唱歌</label>
    				   <label><input type="CheckBox" name="like[]" value="run" checked/>跑步</label>
    				   <label><input type="CheckBox" name="like[]" value="swiming"/>游泳</label>
    				   <label><input type="CheckBox" name="like[]" value="read"/>阅读</label><br/>
    			</p>
    			<!--下拉列表-->
    			<p>籍贯:
    			<select name="city">
    				<option value="bj" selected >北京</option>
    				<option value="sh">上海</option>
    				<option value="gz">广州</option>
    				<option value="sd">山东</option>
    				<option value="hn" disabled >河南</option>
    				<option value="hn">湖南</option>
    			</select>
    			</p>
    			<!--文本域-->
    			<p>个人简介:<textarea name="about" style="resize:none" cols="30" rows="5" ></textarea><br/>
    			<!--上传文件和图片-->
    			<p>头像或文件:<input type="file" name="person_pic"></p>
    			<!--按钮-->	
    			<input type="submit" value="提交"/>
    			<input type="reset" value="重置"/>
    			<input type="image" src=""/><br/>
    			<!--数字下拉列表-->
    			<input type="number" step="1" min="0" max="100"/>
    		</form>
    		<!--多媒体元素-->
    		<audio src="./yinpin/gangqin.mp3"  controls ></audio>
    		<video width="600px"  controls src="./croods-03.mp4"></video>
    	</body>
    </html>
    

      

  • 相关阅读:
    IOS开发-CALayer和UIView详细汇总
    IOS开发-第三方SDWebImage下载网络图片的使用
    解决TalbleView头部或底部子控件不显示问题
    node.js http.get 和http.post 数据
    Node.js Express 获取request原始数据
    个人开发者做一款Android App需要知道的事情
    个人开发者的酸甜苦辣
    码农的福利来了, 编程在线Androd 客户端上线了
    console使用技巧
    AngularJS 常用语法
  • 原文地址:https://www.cnblogs.com/xiaofei-bai/p/8053617.html
Copyright © 2011-2022 走看看