forum

home / developersection / forums / how to design a table in css

Ask Question

How to design a table in Css

Anonymous User 2008 02-Mar-2016

We want to design a table in Css. How to design good look in css please give me a sample code.

html css-css3 css

Updated on 02-Mar-2016

Anonymous User

Other

I am a content writter !

Can you answer this question?

Answer

1 Answers

Anonymous User

02-Mar-2016

@{
    Layout = null;

}
<!DOCTYPE html>

<html>

<head>    

    <meta name="viewport" content="width=device-width" />

    <title>Table Design</title>

    <style>

        table {

    width: 100%;

}

th {

    height: 50px;

      text-align: left;

}
 td {

    height: 50px;

       height: 31px;

    vertical-align: middle;

}
 th, td {

    padding: 15px;

    text-align: left;

}
 tr:hover {background-color: #f5f5f5}

 tr:nth-child(even) {background-color: #f2f2f2}

 th {

    background-color: #488ADC;

    color: white;

}
    </style>

</head>

<body>

   <table>

    <tr>

      <th>First Name</th>

      <th>Last Name</th>

      <th>Email</th>

      <th>Contact No</th>

      <th>Address</th>

      
    </tr>

    <tr>

      <td>Aditya</td>

      <td>Patel</td>

      <td>aditya@gmail.com</td>

      <td>7798******</td>

      <td>allahabad</td>       

    </tr>

    <tr>

      <td>manoj</td>

      <td>Patel</td>

      <td>manoj@gmail.com</td>

      <td>7798******</td>

      <td>allahabad</td>  

      
    </tr>

    <tr>

       <td>mohit</td>

      <td>Patel</td>

      <td>Mohit@gmail.com</td>

      <td>7798******</td>

      <td>allahabad</td>      

    </tr>

  </table>

</body>

</html>

forum

How to design a table in Css

Anonymous User

Can you answer this question?

1 Answers

Liked By