• 表单的制作练习


    表单练习

    注册信息表单

    用户名:
    密   码:

    性   别:

    爱   好:

    籍贯:

    个人简介:

    头像或文件:


    <!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>
    

      

  • 相关阅读:
    第十周总结
    冲刺(四)
    冲刺(三)
    冲刺(二)
    冲刺(一)
    生成热词
    c#简单日志类
    WPF 后台代码 实现DynamicResource 绑定赋值
    WPF ListboxItem 双击事件 Command绑定
    mysql的命令行安装,忘记密码,密码重置问题
  • 原文地址:https://www.cnblogs.com/xiaofei-bai/p/8053617.html
Copyright © 2020-2023  润新知