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

Recent added

Open IDX

Open DOCX Vs Code Click Below to Open Editor Open Editor ...