Sunday, 24 September 2017

How to create Attractive Forms in html-5 using some Css code

Copy and paste the code in your html file:


<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Forms </title>

<style>
body
{ margin:0 auto;
padding:0px;
background-color:#99C;
background-image:url(img/1.jpg);
background-size:cover;
}

form
{
margin:0 auto;
width:350px;
height:600px;
background-color:#F6F;
margin-top:100px;
border-radius:50px 20px 50px 20px;
color:#93F;
border:8px   inset #90F;
font-style:italic;
font-weight:bold;
opacity:0.6;

background-image:url(img/2.jpg);
}
TD{
padding:20PX;}

</style>



</head>

<body>

<form>
<br>
<br>

<table>

<tr>
<td> User Name: </td>

<td>
<input type="text" size="15"  required="required" maxlength="10"/>

 </td>
 </tr>

<tr>
<td> Password: </td>
<td> <input type="password" size="15"  required="required"/>  </td>
 </tr>


<tr>
<td> Gender: </td>
<td>
<input type="radio"value="male" name="gender"/>Male <input type="radio" value="Female" name="gender"/>Female
 </td>

 </tr>


<tr>

<td>Education </td>
<td>
<input type="checkbox"  name="EDU" value="SSC"/>SSC
<input type="checkbox"  name="EDU" value="HSC"/>HSC
<input type="checkbox"  name="EDU" value="GRADUATION"/>GRAD
   </td>

</tr>




<TR>

<TD> City: </TD>
<TD>
<select>
<option value="khi">Karachi</option>
<option value="lhr">Lahore</option>
<option value="isb">Islamabad</option>
<option value="MUL">Multan </option>

</select>

</TD>

</TR>

<tr>

<td>Upload Resume: </td>
<td> <input type="file"/>  </td>

</tr>


<tr>

<td> </td>
<td><button> Submit!</button> </td>

</tr>


</table>



</form>


</body>
</html>


No comments:

Post a Comment

Pass Dynamically Added Html Table Records List To Controller In Asp.net MVC

Controller Code: using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.Mvc; using ...