HUB OF TUTORIALS
  • Business
  • Digital Marketing
  • Technology
    • HTML
    • CSS
    • jQuery
    • WordPress
    • Core PHP
    • Mysql
    • JAVA
    • Projects
    • Photography
  • Recipes
  • Others
  • Write for Us
HUB OF TUTORIALS
  • Business
  • Digital Marketing
  • Technology
    • HTML
    • CSS
    • jQuery
    • WordPress
    • Core PHP
    • Mysql
    • JAVA
    • Projects
    • Photography
  • Recipes
  • Others
  • Write for Us
  • Business
  • Digital Marketing
  • Technology
    • HTML
    • CSS
    • jQuery
    • WordPress
    • Core PHP
    • Mysql
    • JAVA
    • Projects
    • Photography
  • Recipes
  • Others
  • Write for Us
HUB OF TUTORIALS
  • Business
  • Digital Marketing
  • Technology
    • HTML
    • CSS
    • jQuery
    • WordPress
    • Core PHP
    • Mysql
    • JAVA
    • Projects
    • Photography
  • Recipes
  • Others
  • Write for Us
CSSHTML

How to use CSS for Table in HTML

In this article, you will learn How to use CSS for Table in HTML.

Example:-

table.html

<html>
<head>
<title>Table</title>
<link rel="stylesheet" href="style.css"/>
</head>
<body>
<table>
<tr>
<th>Roll No.</th><th>Name</th><th>Class</th><th>Gender</th><th>City</th>
</tr>
<tr>
<td>124</td><td>Amandeep Singh</td><td>BCA</td><td>Male</td><td>Amritsar</td>
</tr>
<tr>
<td>136</td><td>Nisha Sharma</td><td>MCA</td><td>Female</td><td>Patiala</td>
</tr>
</table>
</body>
</html>

style.css

table, th, td {
  border: 1px solid black;
}
table {
  width: 100%;
}
th {
  height: 50px;
text-align: left;
  background-color: #4CAF50;
  color: white;

}
td {
  height: 50px;
  vertical-align: bottom;
}
th, td {
  border-bottom: 1px solid #ddd;
}
tr:hover {background-color: #f5f5f5;}

You can check on Facebook

button display table html table table border css table css
How to Create a Navigation Bar using CSSPrevHow to Create a Navigation Bar using CSSMarch 14, 2020
CSS Property of List tag in HTMLMarch 14, 2020CSS Property of List tag in HTMLNext
Search
Recent Posts
  • 10 Tools to Use for More Productive and Effective Writing
  • How Image to Text Tools Improve Student Performance
  • Top 10 Mobile App Development Companies in New York
  • Tips For College Students to Improve Efficiency
  • How To Create A Successful Digital Marketing Strategy
Categories
  • Business
  • Core PHP
  • CSS
  • Digital Marketing
  • HTML
  • JAVA
  • Jobs
  • jQuery
  • Mysql
  • News
  • Others
  • Photography
  • Projects
  • Recipes
  • WordPress

  • How to Create List in HTML
  • How to use Iframe in HTML
  • How to Create a Table in HTML and CSS
  • How to Add New HTML Content using jQuery
  • CSS Property of List tag in HTML
  • How to use CSS for Table in HTML
  • How to Make Basmati Rice Recipe
  • How to Make Indian Kheer Recipe
  • How to Make Spicy Aloo Tikki
  • How to Make Aloo Matar Samosa
  • How to Make Cheese Potato Sandwich
  • How to Make Aloo Palak Methi
  • Company Visitors Management System
  • Complaint Management System using PHP
  • Directory Management System
  • Employee Record Management System
  • Hospital Management System using PHP
  • Vehicle Parking Management System

Copyright © 2022 Hub of Tutorials. All Rights Reserved. Designed by AS Webworks