• 2018.6.21 css的应用---注册表格


    参与css样式表格的注册表单

    <head>
    	<meta charset="UTF-8" />
    	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
    	<meta http-equiv="X-UA-Compatible" content="ie=edge" />
    	<title>注册信息</title>
    	
    	<style>
    		#info{
    			font-size: 20px;
    			color: red;
    		}
    		
    		#sub{
    			font-family: "微软雅黑";
    			font-size: 25px;
    			color: aqua;
    		}
    		
    		#res{
    			font: "arial black";
    			font-synthesis: ;
    			font-size: 20px;
    		}
    	</style>
    	
    </head>
    
    <body>
    	<form action="#" method="post">
    		<table align="center" width="700px" height="300px" border="1" cellspacing="" cellpadding="">
    			<tr id="info">
    				<th colspan="3">填写用户注册信息</th>
    			</tr>
    			<tr>
    				<td>用户名:</td>
    				<td width="6px"><input type="text" name="uname" placeholder="请输入名字" /></td>
    				<td>登录用户名</td>
    			</tr>
    			<tr>
    				<td>密码:</td>
    				<td><input type="password" name="pwd" id="pwd" placeholder="请输入密码" />
    					<td>登录密码,6个以上字母数字组合,不区分大小写</td>
    			</tr>
    			<tr>
    				<td>注册邮箱</td>
    				<td><input type="text" name="email" id="email" value="" /></td>
    				<td>录入后不可修改</td>
    			</tr>
    			<tr>
    				<td>性别</td>
    				<td><input type="radio" name="sex" id="sex" value="man" />男<input type="radio" name="sex" id="sex" value="woman" />女 </td>
    				<td>选择你的性别</td>
    			</tr>
    			<tr>
    				<td>出生年月</td>
    				<td>
    					<select name="year">
    						<option value="">2003</option>年
    						<option>2004</option>
    						<option>2005</option>
    						<option>2006</option>
    					</select>年
    					<select name="month">
    						<option value="">1</option>年
    						<option>2</option>
    						<option>3</option>
    						<option>4</option>
    					</select>月
    
    				</td>
    				<td>选择你的出生年月</td>
    			</tr>
    			<tr>
    				<td>兴趣标签</td>
    				<td align="center">
    					<input type="checkbox" name="" id="" value="" />生活
    					<input type="checkbox" name="" id="" value="" />娱乐
    					<input type="checkbox" name="" id="" value="" />体育
    					<br />
    					<input type="checkbox" name="" id="" value="" />财经
    					<input type="checkbox" name="" id="" value="" />时尚
    					<input type="checkbox" name="" id="" value="" />新闻
    				</td>
    				<td>选择你感兴趣的标签</td>
    			</tr>
    			<tr>
    				<td>头像</td>
    				<td><input type="file" name="head" id="" value="浏览" /></td>
    				<td>选取你的头像文件</td>
    			</tr>
    			<tr>
    				<td>个人简介</td>
    				<td>
    					<textarea name="jieshao " rows="3" cols="30"></textarea>
    				</td>
    				<td>请添加你的个人简介情况</td>
    			</tr>
    		</table>
    		<br />
    		<fieldset>
    			<legend>hhh</legend>
    			<input type="button" name="" id="" value="表格" />
    		</fieldset>
    		<p align="center">
    		<input  type="reset" name="res" id="res" value="取消" />
    		<input  type="submit" name="sub" id="sub" value="提交" />
    		</p>
    	</form>
    </body>
    
    <!DOCTYPE html>
    <html lang="zh">
    
    	<head>
    		<meta charset="UTF-8" />
    		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
    		<meta http-equiv="X-UA-Compatible" content="ie=edge" />
    		<title>注册信息</title>
    		
    		<style>
    			#info{
    				font-size: 20px;
    				color: red;
    			}
    			
    			#sub{
    				font-family: "微软雅黑";
    				font-size: 25px;
    				color: aqua;
    			}
    			
    			#res{
    				font: "arial black";
    				font-synthesis: ;
    				font-size: 20px;
    			}
    		</style>
    		
    	</head>
    
    	<body>
    		<form action="#" method="post">
    			<table align="center" width="700px" height="300px" border="1" cellspacing="" cellpadding="">
    				<tr id="info">
    					<th colspan="3">填写用户注册信息</th>
    				</tr>
    				<tr>
    					<td>用户名:</td>
    					<td width="6px"><input type="text" name="uname" placeholder="请输入名字" /></td>
    					<td>登录用户名</td>
    				</tr>
    				<tr>
    					<td>密码:</td>
    					<td><input type="password" name="pwd" id="pwd" placeholder="请输入密码" />
    						<td>登录密码,6个以上字母数字组合,不区分大小写</td>
    				</tr>
    				<tr>
    					<td>注册邮箱</td>
    					<td><input type="text" name="email" id="email" value="" /></td>
    					<td>录入后不可修改</td>
    				</tr>
    				<tr>
    					<td>性别</td>
    					<td><input type="radio" name="sex" id="sex" value="man" />男<input type="radio" name="sex" id="sex" value="woman" />女 </td>
    					<td>选择你的性别</td>
    				</tr>
    				<tr>
    					<td>出生年月</td>
    					<td>
    						<select name="year">
    							<option value="">2003</option>年
    							<option>2004</option>
    							<option>2005</option>
    							<option>2006</option>
    						</select>年
    						<select name="month">
    							<option value="">1</option>年
    							<option>2</option>
    							<option>3</option>
    							<option>4</option>
    						</select>月
    
    					</td>
    					<td>选择你的出生年月</td>
    				</tr>
    				<tr>
    					<td>兴趣标签</td>
    					<td align="center">
    						<input type="checkbox" name="" id="" value="" />生活
    						<input type="checkbox" name="" id="" value="" />娱乐
    						<input type="checkbox" name="" id="" value="" />体育
    						<br />
    						<input type="checkbox" name="" id="" value="" />财经
    						<input type="checkbox" name="" id="" value="" />时尚
    						<input type="checkbox" name="" id="" value="" />新闻
    					</td>
    					<td>选择你感兴趣的标签</td>
    				</tr>
    				<tr>
    					<td>头像</td>
    					<td><input type="file" name="head" id="" value="浏览" /></td>
    					<td>选取你的头像文件</td>
    				</tr>
    				<tr>
    					<td>个人简介</td>
    					<td>
    						<textarea name="jieshao " rows="3" cols="30"></textarea>
    					</td>
    					<td>请添加你的个人简介情况</td>
    				</tr>
    			</table>
    			<br />
    			<fieldset>
    				<legend>hhh</legend>
    				<input type="button" name="" id="" value="表格" />
    			</fieldset>
    			<p align="center">
    			<input  type="reset" name="res" id="res" value="取消" />
    			<input  type="submit" name="sub" id="sub" value="提交" />
    			</p>
    		</form>
    	</body>
    </html>
    
  • 相关阅读:
    环形进度条
    Angular.js入门(2)
    Angular.js入门(1)
    判断页面是手机访问还是电脑访问
    常见问题lufylegend.js
    JavaScript如何诞生
    管理思维修炼
    CROS+node-basis+ajax
    JavaScript操作cookie
    node-basis(提供nodejs开发的基础包)
  • 原文地址:https://www.cnblogs.com/qichunlin/p/9175078.html
Copyright © 2020-2023  润新知