RetroSearch Browse

Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://www.w3resource.com/html-css-exercise/basic/th-scope-answer.php below:

Website Navigation

HTML5: How to specify whether a header cell is a header for a column, row, or group of columns or rows ?

HTML5: How to specify whether a header cell is a header for a column, row, or group of columns or rows ?Last update on February 14 2024 12:55:57 (UTC/GMT +8 hours)

Go to Exercise page

Solution:

HTML Code:

<!DOCTYPE html><!-- Define document type as HTML -->
<html><!-- Begin HTML document -->
<head><!-- Start of document header -->
<meta charset="utf-8"><!-- Define character encoding -->
<title>How to specify whether a header cell is a header for a column, row, or group of columns or rows</title><!-- Title of the HTML page -->
</head><!-- End of document header -->
<body><!-- Start of document body -->
<table width="200" border="1" cellpadding="2"><!-- Table element with width, border, and cell padding attributes -->
<tr><!-- Table row element -->
<th scope="col">Student Code</th><!-- Table header cell for "Student Code" scoped to a column -->
<th scope="col">Percentage of marks</th><!-- Table header cell for "Percentage of marks" scoped to a column -->
<th scope="col">Grade</th><!-- Table header cell for "Grade" scoped to a column -->
<th scope="col">Remarks</th><!-- Table header cell for "Remarks" scoped to a column -->
<tr><!-- End of table row -->
</tr><!-- End of table row (incorrectly placed, should be after the opening <tr> tag) -->
<td>S001</td><!-- Table data cell with content "S001" -->
<td>92</td><!-- Table data cell with content "92" -->
<td>A+</td><!-- Table data cell with content "A+" -->
<td>Excellent</td><!-- Table data cell with content "Excellent" -->
<tr><!-- Table row element -->
</tr><!-- End of table row -->
<td>S002</td><!-- Table data cell with content "S002" -->
<td>76</td><!-- Table data cell with content "76" -->
<td>B+</td><!-- Table data cell with content "B+" -->
<td>Good</td><!-- Table data cell with content "Good" -->
</tr><!-- End of table row -->
</table><!-- End of table -->
</body><!-- End of document body -->
</html><!-- End of HTML document -->

Explanation:

This HTML code defines a webpage with a table displaying student information.
The <table> tag creates a table structure with specific attributes such as width, border, and cell padding.
The <th> tags create header cells scoped to columns using the scope="col" attribute.
Each <tr> tag represents a row in the table, but the second and third <tr> tags are misplaced and should be inside the table row.
Each <td> tag represents a cell in the table containing data.

Live Demo:

See the Pen th-scope-answer by w3resource (@w3resource) on CodePen.

See the solution in the browser

Supported browser

Go to Exercise page

What is the difficulty level of this exercise?

Test your Programming skills with w3resource's quiz.

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4