1. 程式人生 > >HTML登錄頁面

HTML登錄頁面

html css

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>無標題文檔</title>

<style>

#demo{ width:90%;height:300px;background-image:url(1.jpg);margin-top:100px; margin:0 auto;}

p{ font-size:30px;text-align:center;color:#FFF;padding-top:60px; line-height:6px;}

.ce{margin:0 auto;}

.de{border:1px solid white; border-radius:3px; background-color:rgba(255,255,255,0.2);margin-left:504px; width:200px;height:30px; margin-bottom:10px; color:#FFF;}

</style>

</head>


<body>

<div id="demo">

<p>Welcome</p>

<form action="" class="ce">

<input type="text" value="Username" style="text-align:center;" class="de"><br/>

<input type="text" value="Password" style="text-align:center;" class="de"><br/>

<input type="text" value="Login" style="text-align:center; background-color:#FFF;color:#74cdb9;" class="de">

</form>

</div>

</body>

</html>


效果如圖:

技術分享圖片

HTML登錄頁面