<!DOCTYPE html> |
<html lang= "en" > |
<head> |
<meta charset= "UTF-8" /> |
<title>jquery登录框特效5</title> |
<link rel= "shortcut icon" href= "../favicon.ico" > |
<link rel= "stylesheet" type= "text/css" href= "css/style.css" /> |
<!--[ if lte IE 7]><style>.main{display:none;} .support-note .note-ie{display:block;}</style> |
<![endif]--> |
<style> |
body { |
background: #eedfcc url(images/bg3.jpg) no-repeat center top; |
-webkit-background-size: cover; |
-moz-background-size: cover; |
background-size: cover; |
} |
.container > header h1, .container > header h2 { |
color: #fff; |
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5); |
} |
</style> |
</head> |
<body> |
<div class= "container" > |
<section class= "main" > |
<form class= "form-5 clearfix" > |
<p> |
<input type= "text" id= "login" name= "login" placeholder= "Username" > |
<input type= "password" name= "password" id= "password" placeholder= "Password" > |
</p> |
<button type= "submit" name= "submit" > <i class= "icon-arrow-right" ></i> <span>Sign in </span> </button> |
</form> |
</section> |
</div> |
<!-- jQuery if needed --> |
<script type= "text/javascript" src= "http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" ></script> |
<script type= "text/javascript" src= "js/jquery.placeholder.min.js" ></script> |
<script type= "text/javascript" > |
$( function (){ |
$( 'input, textarea' ).placeholder(); |
}); |
</script> |
</body> |
</html> |