Creating a html page using Styling Text Inputs
<!DOCTYPE html>
<html>
<head>
<title>Styling Text Inputs</title>
<style type="text/css">
input {
font-size: 120%;
color: #5a5854;
background-color: #f2f2f2;
border: 1px solid #bdbdbd;
border-radius: 5px;
padding: 5px 5px 5px 30px;
background-repeat: no-repeat;
background-position: 8px 9px;
display: block;
margin-bottom: 10px;}
input:focus, input:hover {
background-color: #ffffff;
border: 1px solid #b1e1e4;}
input#email {
background-image: url("images/email.png");}
input#twitter {
background-image: url("images/twitter.png");}
input#web {
background-image: url("images/web.png");}
</style>
</head>
<body>
<form>
<input type="text" id="email" />
<input type="text" id="twitter" />
<input type="text" id="web" />
</form>
</body>
</html>
output:
0 comments:
Post a Comment