Web page development.

Web page development.

Making table by using html.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Table</title>
    <link rel="stylesheet" href="style.css"></a>
</head>
<body>
 <table border="1">
    <tr>
        <th rowspan="9">Department</th>
        <th rowspan="4">ec</th>
        <th>sub1</th>
    </tr>
    <tr>
        <td>sub2</td>
    </tr>
    <tr><td>
        sub3
    </td></tr>
    <tr>
        <td>sub4

        </td>
    </tr>
    <tr>
        <td rowspan="5">
            hi
        </td>
    </tr>
    <tr>
        <td>
            sub1
        </td>
    </tr>
    <tr>
        <td>
            sub2
        </td>
    </tr>
    <tr>
        <td>sub3</td>
    </tr>
    <tr><td>
        sub4
    </td></tr>

 </table>
</body>
</html>

Making table by using html and css.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Table</title>
    <style>
        table,th,td{
            border:2px solid black;
            border-collapse:collapse;
            padding:8px;
            text-align:center;
            margin:auto;
            font-family:cursive;
        }
        th{
            font-family:arial;
            background:green;
        }
        tr:nth-child(even){
            background-color:rgb(182, 222 ,289);
            color:blue;
            font-weight:800px;
        }
        tr:nth-child(odd):hover{
            background-color:rgb(182, 222 ,289);
            color:red;
            font-weight:800px;
        }
        </style>
<table>
    <tr>
        <th>Head</th>
        <th>Head</th>
        <th>Head</th>
        <th>Head</th>
        <th>Head</th>
    </tr>
    <tr>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
    </tr>
    <tr>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
    </tr>
    <tr>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
    </tr>
    <tr>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
    </tr>
    <tr>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
    </tr>s
</table>


 </table>
</body>
</html>

Form

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Table</title>
    <link rel="stylesheet" href="style.css">
    <style>
        .container{
    box-shadow:0 0 15 #aaa;
    border:2px solid black;
    border-radius:10px;
    max-width:500px;
    padding:20px;
    margin:auto;
    font-family:cursive;



}
label,button{
    display:block;
    margin:5px;
}
input{
    width:100%;
    padding:8px;
    border:none;
    box-shadow:4ox 7px  8px 0 #aaa;
    border-radius:20px;
    background-color:#a5eeeb;
}
button{
    width:100%;
    padding:8px;
    border:none;
    margin-top:20px;
    border-radius:20px;
    background-color:rgb(54, 117, 54);
    color:white;
    font-weight:900;
}
button:active{
    background-color:black;
}



    </style>
<body>
 <form class="container">
    <label for="username">Username</label>
    <input type="text" placeholder="Enter your name"><br>
    <label for="email">Email</label>
    <input type="email" placeholder="Enter email"><br>
    <label for="Password">Password</label>
    <input type="Password" placeholder="Enter password"><br>


    <button id="btn">submit</button><br>



 </form>


</body>
</html>