當前位置：首頁 » 編程語言 » html的登錄界面模板

html的登錄界面模板

發布時間: 2021-03-23 09:09:22

㈠ html登錄界面代碼

<html>
<head>
<title>登錄界面抄</title>
</head>
<body>
<h2>登錄界面：襲</h2>
<form>
請輸入你的用戶名：<br>
<input type="text" /><br>
輸入你的地址：<br>
<input type="text" /><br>
填上密碼：<br>
<input type="text" /><br>
選擇你的性別：<br>
<input type="radio" value="男" name="sex"/>男
<input type="radio" value="女" name="sex"/>女<br>
選擇你的愛好：<br>
<input type="checkbox" vlaue="游泳" />游泳
<input type="checkbox" vlaue="旅遊" />旅遊
<input type="checkbox" vlaue="上網" />上網
<input type="checkbox" vlaue="新聞" />新聞<br>
<input type="submit" value="提交" />
<input type="reset" value="重填" />
</form>
</body>
</html>

㈡求登錄界面 html，簡單大氣的，急

根據別人的模板改的。要就留言。

㈢用html代碼編寫一個簡單的登陸界面

<!DOCTYPE html><html lang="zh-CN"><head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>登錄</title>
<link href="css/bootstrap.min.css" rel="stylesheet"></head><body><nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="./">jsp作業</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li><a href="login.html">登錄</a></li>
</ul>
</div>
</div></nav><div class="container">
<div class="row">
<div class="col-md-4">

</div>
<div class="col-md-4">
<form class="form-signin" target="submitFrame" method="post">
<h2 class="form-signin-heading">登錄到jsp作業</h2>
<label for="inputEmail">Email</label>
<input type="email" id="inputEmail" class="form-control" placeholder="請輸入Email" required autofocus><br>
<label for="inputPassword">密碼</label>
<input type="password" id="inputPassword" class="form-control" placeholder="請輸入密碼" required>
<div class="checkbox">
<label>
<input type="checkbox" value="remember-me" checked="checked"> 記住密碼 </label>
</div>
<button type="submit" class="btn btn-primary" id="btn-login">登錄</button>
<a href="reg.html" class="btn btn-default">注冊</a>
</form>
<iframe style="display: none;" name="submitFrame" src="about:blank"></iframe>
</div>
<div class="col-md-4">
</div>
</div>
<script src="js/jquery.min.js"></script></body></html>

㈣ html登錄界面設置賬號密碼

寫js啊，
<script>
var username = document.getElementsClassName('bt_input')[0];
var password = document.getElementsClassName('bt_input')[1];
var button= document.getElementsClassName('logingBut')[0];
button.onclick=function(){
if(username .value=="user"&&password .value=="123456"){
location.href="下一個網頁的網址";
}else{
alert("賬號或密碼錯誤！");
window.opener = null;
window.open("", "_self");
window.close();

}
}
</script>
把這段代碼放在</body>前面就好了，，純手打，點贊哈

㈤登錄頁面html代碼

<htmlxmlns="http://www.w3.org/1999/xhtml"><head>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8">
<title>貴美商城</title>
<linkrel="stylesheet"type="text/css"href="css/global.css">
<linkrel="stylesheet"type="text/css"href="css/layout.css">
		
<scripttype="text/javascript">
//snameCheck()&&passCheck()
functionvalidateform(){
	if(snameCheck()&&passCheck())
	returntrue;
	else
	returnfalse;
}

//ScreenNameValidation
functionsnameCheck(){
varsname=document.getElementsByName("sname")[0].value;
varillegalChars=/W/;
	if(sname.length!=0){
		if(illegalChars.test(sname)){
		document.getElementById("passMsg").innerHTML.replace(/'會員名無效'/,'');
document.getElementById("passMsg").innerHTML='會員名無效';
		document.getElementsByName("sname")[0].select();
		returnfalse;
		}
	}
	else
	{
	document.getElementById("userMsg").innerHTML.replace(/'是否忘記輸入會員名？'/,'');
document.getElementById("userMsg").innerHTML='是否忘記輸入會員名？';
	document.getElementsByName("sname")[0].focus();
	returnfalse
	}
	if(sname!=="zhangsan"){//驗證會員名必須為張三
	document.getElementById("userMsg").innerHTML.replace(/'是否輸入的會員名有錯？'/,'');
document.getElementById("userMsg").innerHTML='是否輸入的會員名有錯？';
	document.getElementsByName("sname")[0].focus();
	returnfalse;
	}
	returntrue;
}

functionpassCheck(){
varuserpass=document.getElementsByName("pass")[0].value;
varillegalChars=/[W_]/;//allowonlycharactorsandnumbers
	//CheckifPasswordfieldisblank.
	if(userpass==""){
		document.getElementById("passMsg").innerHTML.replace(/'未輸入密碼
"+"請輸入密碼'/,'');
document.getElementById("passMsg").innerHTML='未輸入密碼
"+"請輸入密碼';
		document.getElementsByName("pass")[0].focus();
	returnfalse;
	}
	//.
	if(userpass.length<6){
		document.getElementById("passMsg").innerHTML.replace(/'密碼必須多於或等於6個字元。
'/,'');
document.getElementById("passMsg").innerHTML='密碼必須多於或等於6個字元。
';
		document.getElementsByName("pass")[0].focus();
	returnfalse;
	}
	//.
	elseif(illegalChars.test(userpass)){
		document.getElementById("passMsg").innerHTML.replace(/'密碼包含非法字元'/,'');
document.getElementById("passMsg").innerHTML='密碼包含非法字元';
		document.getElementsByName("pass")[0].select();
		returnfalse;
	}
	if(userpass!=="123456"){//驗證密碼必須為123456
	document.getElementById("passMsg").innerHTML.replace(/'密碼錯誤，請重新輸入！'/,'');
document.getElementById("passMsg").innerHTML='密碼錯誤，請重新輸入！';
		document.getElementsByName("pass")[0].focus();
		returnfalse;
	}
	returntrue;
}
</script>	
<scripttype="text/javascript"charset="utf-8"src="http://cdn.gwdang.com/js/gwdang-notifier-bdext.js"></script></head>
<body>
<divid="container">
	<iframeid="header"src="header.htm"width="980"height="136"frameborder="0"scrolling="no"></iframe>
	<formaction="login_success"method="post">
	<divclass="login">
		<ulclass="formf_l">
			<h1><imgsrc="images/logintitle.gif"alt="會員登錄"></h1>
			<liclass="login_list"><label>會員名：</label><inputtype="text"name="login">（可包含a-z、0-9和下劃線）</li>
			<liclass="login_list"><label>密&nbsp;&nbsp;&nbsp;碼：</label><inputtype="text"name="pwd">（至少包含6個字元）</li>
			<liclass="a_c"><imgsrc="images/login.gif"alt="登錄"></li>
			<liclass="desc">δ&nbsp;&nbsp;<ahref="#">什麼是安全登錄</a>。</li>
			<liclass="desc">δ&nbsp;&nbsp;香港會員（繁體中文用戶）由此<ahref="#">登入</a></li>
			<liclass="desc">δ&nbsp;&nbsp;<ahref="#">密碼安全貼士</a>。</li>
			<liclass="desc">δ&nbsp;&nbsp;防止病毒或者木馬竊取您的賬戶信息，<ahref="#">在線檢查</a>您的電腦是否安全。</li>						
		</ul>
			<h1><imgsrc="images/register.gif"alt="注冊會員"></h1>
		<ulclass="asidef_l">
			<liclass="regpic"><span>便宜有好貨！</span>超過7000萬件商品任您選。</li>
			<liclass="regpicregpic2"><span>買賣更安全！</span>交易超安全。</li>
			<liclass="regpicregpic3"><span>免費開網店！</span>輕松賺錢交友。</li>
			<liclass="regpicregpic4"><span>超人氣社區！</span>彩活動每一天</li>
			<liclass="a_c"><ahref="#"><imgsrc="images/registernow.gif"alt="現在就注冊"></a></li>
			<ulclass="reged">
			<liclass="regpicregpic5">您已經是會員？<ahref="#">由此登入</a></li>
			<liclass="regpicregpic6">繁體中文用戶由此<ahref="#">注冊</a></li>
			</ul>
		</ul>
	</div>
	</form>
	<iframeid="footer"src="footer.htm"width="980"height="136"frameborder="0"scrolling="no"></iframe>
</div><!--containerend-->	<divclass="_bd_ext_tip"style="visibility:hidden;"><spanclass="_bd_ext_search">網路一下</span><spanclass="_bd_ext_open">打開鏈接</span><spanclass="_bd_ext_">復制</span></div></body></html>

㈥ html登陸界面代碼

實現這個功能要兩個網頁，一個是前台靜態網頁，用兩個文本框分別為t1，t2，一回個按鈕active後面寫上你要跳答轉的後台網頁的名稱如"houtai.asp"
以下是houtai.asp的代碼
<%
dim
a,b
a=request.from("t1")
b=request.from("t2")
if
a<>admin
then
response.write
"用戶名錯誤"
else
if
b<> 123456
then

response.write
"密碼錯誤"

else
response.redirect
"你要轉到的主頁.asp"
end
if
end
if
%>

㈦怎麼用html技術實現一個登錄界面

可以做到的，建議去w3c網站查詢一些相關學習資料

㈧求大神寫一個HTML的登錄界面,連帶css樣式

這個可以參考一下：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<link href="main.css" type="text/css" rel="stylesheet">
<title>登陸界面</title>
</head>

<body>
<div class="login_ico">
<img src="images/login_ico.png">
</div>
<div class="login_putin">
<ul>
<li><input type="text" ></li>
<li><input type="password" ></li>
</ul>
</div>
<div class="login_btn">
<input type="submit" value="登陸">
</div>
</body>
</html>
樣式：

*{
margin:0;
padding:0;}

li{
list-style-type:none;
margin:0;
padding:0;}
a{
text-decoration:none;
color:#000;}

/*---------------------按鈕-----------------------------*/
.login_putin ul li input{
margin: 0;
width:70%;
padding: 1em 2em 1em 5.4em;
-webkit-border-radius:.3em;
-moz-border-radius: .3em;
border: 1px solid #999;
}

.login_btn{
width:300px;
margin:40px auto 0 auto;
}

.login_btn input{
width:100%;
margin:0;
padding:.5em 0;
-webkit-border-radius:.3em;
-moz-border-radius: .3em;
border:#1263be solid 1px;
background:#1b85fd;
color:#FFF;
font-size:17px;
font-weight:bolder;
letter-spacing:1em;
}

.login_btn input:hover{
background:#1263be;
}

閱讀全文

html的登錄界面模板

與html的登錄界面模板相關的閱讀推薦