• html表单代码演示


    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml" lang="en">
    	<head>
    		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    		<title></title>
    	</head>
    	<body>
    <!--		<form  method="post" action="server.html">
    			<input type="text"  name="username1"/>
    			<input type="password" name="passwd"/>
    			<input type="submit" value="提交" />
    		</form>-->
    		
    		<form  method="get" action="server.html">
    			<!--(只有在form表单时有效)name:提交表单时此文本框的值value存储在name变量中,并传给后台服务器,我们可以通过请求头信息查看-->
    			文本标签1:<input type="text" value="zhangsan" maxlength="5"  name="u1" tabindex="5"/><br/>
    			文本标签2:<input type="text" value="zhangsan" maxlength="5"  name="u2" tabindex="3"/><br/>
    			文本标签3:<input type="text" value="zhangsan" maxlength="5"  name="u3" tabindex="2"/><br/>
    			文本标签4:<input type="text" value="zhangsan" maxlength="5"  name="u4" tabindex="1"/><br/>
    			文本标签5:<input type="text" value="zhangsan" maxlength="5"  name="u5" tabindex="4"/><br/>
    			
    <!--		
    			按钮标签:<input type="button" value="注册" name="btn"/><br/>
    			图片标签:<input type="image" value="图片" name="img"/><br/>
    			-->
    			
    		<hr/>
    		<!--input disabled 禁用  ,不光这个输入框不能使用,且值也不能传输到服务器,tabindex也不起作用-->
    			<input type="text" disabled="disabled" name="disabled" value="dsiabled" /><br/>
    		<!--input readonly 只读  只是输入框不能操作修改,但是值能传输到服务器 ,tabindex起作用 -->	
    			<input type="text" readonly="readonly" name="readonly" value="readonly" /><br/>
    			
    		<!--input type="password"-->	
    			<input type="password" value="123456"/><br/><hr/>
    			
    		<!--textarea:文本区  多行文本输入框        一个中文字符占两列,  			
    		在没超过指定行数的时候,可能会看到输入的列数多一列字的效果,不同浏览器,效果不同
    		特点:没有value属性,内容是初始化在标签之间
    		          没有maxlength属性
    		          使用rows和cols属性指定行数和列数。
    		注意:6行6列的多行文本框,在不显示滚动条的情况下最多显示36个英文字符,或者18个中文字符。          
    		-->	
    			<textarea rows="6" cols="6" maxlength="20" name="textarea">qwer</textarea><br/>
    
    		<!--select 列表框  
    			selected属性  是设置默认值,即被选中的值
    			
    		-->
    			<select name="select">
    				<option value="china">中国</option>
    				<option value="USA">美国</option>
    				<option value="UK" selected="selected">英国</option>
    			</select>	
    
    			<select>
    				<option value="hp">黄埔</option>
    				<option value="pd">浦东</option>
    				<option value="xh">徐汇</option>
    			</select><br/>	
    			
    				
    			<!--optgroup  对选项分组-->
    			<select>
    				<optgroup label="上海">
    					<option>外滩</option>
    					<option>南京东路</option>
    					<option>东明明珠塔</option>
    				</optgroup>
    				<optgroup label="合肥">
    					<option>逍遥津</option>
    					<option>地质博物馆</option>
    					<option>植物园</option>
    				</optgroup>				
    			</select><br/>
    			
    			<select size="5" multiple="multiple">
    				<option>上海</option>
    				<option>北京</option>
    				<option>天津</option>
    				<option>深圳</option>
    				<option>广东</option>
    				<option>常州</option>
    				<option>温州</option>
    				<option>厦门</option>
    			</select><br/>
    			
    			<!--单选按钮-->
    			男:<input type="radio" value="man" name="sex"/>
    			女:<input type="radio" value="woman" name="sex"/><br/>
    			
    			<!--多选框 checkbox-->
    			爱好:<input type="checkbox" value="basketball" name="hobby">篮球
    				  <input type="checkbox" value="Songs" name="hobby">听歌
    				  <input type="checkbox" value="playComputer" name="hobby">玩电脑
    				  <input type="checkbox" value="sing" name="hobby">唱歌
    				  <input type="checkbox" value="run" name="hobby">跑步<br/>	
    				  	
    			<!--一般按钮-->	  	
    			<input type="button" value="一般按钮"/><br><hr>
    			
    			<!--图片按钮-->
    			<input type="image" src="../img/111.jpg" alt="图片按钮" style=" 50px;height: 50px;" title="美女图片"/><br/><br/>
    			
    			<!--隐藏类型 hidden只是在页面中不显示,用户看不见,但不代表没有,传给服务器的时候,数据仍传送 -->
    			<input type="text" value="nohidden"/>
    			<input type="hidden" value="hidden" name="hidden" />hidden跑哪去了<br/>
    			
    			<!--for标签-->
    			<label for="man">男:</label><input type="radio" value="man" name="sex" id="man"/>
    			<label for="woman">女:</label><input type="radio" value="woman" name="sex" id="man"/><br/>
    			
    			<br/>
    			<!--分组框fieldset-->
    			<fieldset style="280px">
    				<legend>QQ注册</legend>
    				<ul style="list-style: none;">
    					<li><label for="username">用户名:</label><input type="text" name="username" id="username"/></li>
    					<li><label for="password">密   码:</label><input type="password" name="password" id="password"/></li>
    				</ul>
    				<ol style="list-style: none;">
    					<li><label for="username">用户名:</label><input type="text" name="username" id="username"/></li>
    					<li><label for="password">密   码:</label><input type="password" name="password" id="password"/></li>
    				</ol>
    			</fieldset>
    			
    <!--			<fieldset style="280px">
    				<legend>QQ注册</legend>
    				<div>
    					<label for="username">用户名:</label><input type="text" name="username" id="username" style="margin-left: 1px;"/>
    				</div>
    				<div>
    					<label for="password">密   码:</label><input type="password" name="password" id="password" style="margin-left:3px"/>
    				</div>
    			</fieldset>	-->
    				
    			<fieldset style="280px">
    				<legend>QQ登录</legend>
    				<table>
    					<tr>
    						<td><label for="username">用户名:</label></td>
    						<td><input type="text" name="username" id="username"/></td>
    					</tr>	
    					<tr>
    						<td><label for="password">密   码:</label></td>
    						<td><input type="password" name="password" id="password"/></td>
    					</tr>
    				</table>	
    			</fieldset>
    			
    			<fieldset style="320px;height:187px;margin-left: 530px;">
    				<legend>QQ上线</legend>
    				<div style="margin-left: 41px;margin-top: 50px;">
    					<label for="username2">用户名:</label><input type="text" name="username2" id="username2"/>
    				</div>
    				<div style="margin-left: 41px;margin-top: 6px;">
    					<label for="password2">密码:</label><input type="password" name="password2" id="password2" style="margin-left: 16px;"/>
    				</div>	
    			</fieldset>
    			
    			<br/><hr/>
    			
    			<frameset cols="200px,20%,*">
    				<frame src="#"/>
    				<frame src="#"/>
    				<frame src="#"/>
    			</frameset>
    			
    			<br/><input type="submit" value="提交" />    <input type="reset" value="重置"/>
    		</form>
    	</body>
    </html>
    

      

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml" lang="en">
    	<head>
    		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    		<title></title>
    	</head>
    	<body>
    	<h1>这里是服务器接受页面!!!</h1>
    	</body>
    </html>
    

      

  • 相关阅读:
    高等数学(6) 无穷小和无穷大
    高等数学(5) 函数的极限
    高等数学(4) 数列与数列极限
    实时音视频互动系列(下):基于 WebRTC 技术的实战解析
    实时音视频互动系列(上):又拍云UTUN网络详解
    免费SSL&付费SSL证书,该如何选择?
    直播卡顿原因详解及优化
    实战解析 | 同步音视频解决方案
    从Html5直播到互动直播,看直播协议的选择
    如何将HLS延时缩短至4秒,HLS+技术详解
  • 原文地址:https://www.cnblogs.com/1020182600HENG/p/6832585.html
Copyright © 2020-2023  润新知