How to create a form using html and css

 How to create a form using HTML and CSS



<html>
<head>
    <title>

    </title>
    <style>
        *{
            font-family:cursive;
            background-color: aquamarine;
        }
        input[type="text"]{
            background-color: gray;
            color: white;
            text-align: center;
            border-radius: 5px;
        }
        input[type="email"]{
            background-color: gray;
            color: white;
            text-align: center;
            border-radius: 5px;
        }
        textarea{
             background-color: gray;
            color: white;
            text-align: center;
            border-radius: 5px;
        }
        input[type="submit"]{
            background-color: green;
            color: black;
            border-radius: 5px;
        }
        input[type="reset"]{
            background-color: green;
            color: black;
            border-radius: 5px;
        }
    </style>
</head>
<body>
    <center>
    <font face="cursive" size="6" >
        Sample form
    </font>
    </center>
    <form>
        <center>
        <table border="0">
            <tr>
                <td>1.</td>
                <td>First Name</td>
                <td>:</td>
                <td><input type="text" name="fname"></td>
            </tr>
            <tr>
                <td>2.</td>
                <td>Last Name</td>
                <td>:</td>
                <td><input type="text" name="lname"></td>
            </tr>
            <tr>
                <td>3.</td>
                <td>Email</td>
                <td>:</td>
                <td><input type="email"></td>
            </tr>
            <tr>
                <td>4.</td>
                <td>Phone No</td>
                <td>:</td>
                <td><input type="text" name="num"></td>
            </tr>
            <tr>
                <td>5.</td>
                <td>Address</td>
                <td>:</td>
                <td><input type="text" name="adr"></td>
            </tr>
            <tr>
                <td>6.</td>
                <td>Gender</td>
                <td>:</td>
                <td>
                <input type="radio" name="gtype" value="Male">Male
                <input type="radio" name="gtype" value="Female">Female</td>
            </tr>
            <tr>
                <td>7.</td>
                <td>Question</td>
                <td>:</td>
                <td><textarea rows="4" cols="20" ></textarea></td>
            </tr>
            <br>
            <tr>
                <td></td>
                <td><input type="submit" value="Submit"></td>
                <td></td>
                <td><input type="reset" value="Reset"></td>
            </tr>
        </table>
        </center>
    </form>
</body>
</html>


-

Post a Comment

Previous Post Next Post