Category

Thursday, November 11, 2021

Source Code of HTML Form Styling With CSS


<!DOCTYPE html>
<html>
<head>
<title>Wasim Teach</title>
<meta charset="UTF-8"/>
<link rel="stylesheet" href="" type="text/css"/>
</head>
<body>
<div class="div1">
<h3  class="dmo">Demo log in Form</h3>
<input class="inp" placeHolder= "E-mail"></input>
<input class="inp" placeHolder= "Password"></input>
<button class= "btn">Log in</button>
<font  color= "white" size= "3">Forgot Password.</font>
</div>

<style>
.div1{
background-color:#000000;
width:200px;
height:250px;
position:relative;
top:50px; left:50px;
border:solid;
border-radius:0px 50px 0px 50px;
padding:40px;


}

.dmo{
color:#ffffff;
padding:0px;
border:solid;
padding:5px;
border-color:#ffff00;
border-width:0px 0px 3px 0px;
margin:10px;
}


.inp{
background-color:#8F0873;
color:#ffffff;
border:solid;
border-color:#ffffff;
border-radius: 0px 16px 0px 16px;
padding:10px;
margin:10px;

}

.inp::placeholder {
  color: yellow;
  font-size: 1.2em;
  font-style: italic;
}

.btn
{
background-color:#8F0873;
color:#ffffff;
border:solid;
border-color:#ffff00;
border-radius: 16px;
padding:4px;
margin:10px;
width:150px;
font-size:20px;


}

</style>

</body>
</html>


View Out Put of this Code

Click Here


2 comments:

  1. Thanks for sharing this code. I love this. I am also an expert in technology field. I would like to tell you about my blog How Long Does iOs 15 Take To Install?.

    ReplyDelete
  2. I am very glad to find this code I use this code on my project thanks sir
    Your blog is awesome thank you for sharing this type of post God bless you.

    ReplyDelete