yes I want to know more about the html tables in details: 18 MCQs with answers

All 18 multiple-choice questions from this kit, free and with no sign-up.

Warm-up · 6 questions

Q1. Which tag declares the start of an HTML table?

Beginner
A `<tr>` B `<tab>` C `<table>` D `<grid>`
Show answer & explanation

`<table>`

`` is the container element that declares a table. `` only defines a single row inside it.

Q2. Which tag represents one horizontal row of data?

Beginner
A `<td>` B `<th>` C `<tr>` D `<row>`
Show answer & explanation

`<tr>`

`` stands for table row and holds the cells for one horizontal line of data.

Q3. Which tag holds an ordinary data cell inside a row?

Beginner
A `<th>` B `<td>` C `<cell>` D `<data>`
Show answer & explanation

`<td>`

`` is the table data cell that holds ordinary content inside a ``.

Q4. Which tag marks a cell as a header or label for surrounding data?

Beginner
A `<td>` B `<label>` C `<th>` D `<head>`
Show answer & explanation

`<th>`

`` is the table header cell; it carries the semantic meaning of a label for the data around it.

Q5. Is there a dedicated column tag in basic HTML?

Beginner
A Yes, `<col>` defines a column. B Yes, `<tc>` defines a column. C No, columns are implied by cell position. D Yes, `<column>` defines a column.
Show answer & explanation

No, columns are implied by cell position.

Basic HTML has no column tag. Columns are implied by the position of cells within each row.

Q6. HTML tables are designed for tabular data, not page layout; using them for layout breaks accessibility and responsiveness.

Beginner
A True B False
Show answer & explanation

True

HTML tables are designed for tabular data, not page layout; using them for layout breaks accessibility and responsiveness.

Building up · 7 questions

Q7. A marksheet has a 'Science' header that should cover Physics, Chemistry, and Biology columns. Which attribute should the header cell use?

Intermediate
A `span="3"` B `width="3"` C `rowspan="3"` D `colspan="3"`
Show answer & explanation

`colspan="3"`

`colspan="3"` makes the cell stretch horizontally across three columns, which is exactly what a header covering three subject columns needs.

Q8. A cell should stretch vertically to label two rows. Which attribute achieves this?

Intermediate
A `colspan="2"` B `rowspan="2"` C `height="2"` D `merge="2"`
Show answer & explanation

`rowspan="2"`

`rowspan="2"` makes a cell stretch across two rows vertically.

Q9. You use `colspan="2"` on a cell in a row that originally had four cells. What must you do?

Intermediate
A Add a `<br>` inside the merged cell. B Remove one cell that would have occupied the merged position. C Add an extra cell to keep the count. D Nothing — the browser adjusts automatically.
Show answer & explanation

Remove one cell that would have occupied the merged position.

When a cell spans multiple positions, the cells that would have occupied those positions must be removed, or the row will have too many cells and the grid will break.

Q10. Which group of tags is used to divide a long table into header, body, and footer sections?

Intermediate
A `<top>`, `<middle>`, `<bottom>` B `<head>`, `<body>`, `<foot>` C `<th>`, `<td>`, `<tf>` D `<thead>`, `<tbody>`, `<tfoot>`
Show answer & explanation

`<thead>`, `<tbody>`, `<tfoot>`

``, ``, and `` group rows into header, body, and footer sections of a table.

Q11. Which tag provides a visible title for a table that is also read by assistive technology?

Intermediate
A `<label>` B `<caption>` C `<title>` D `<h1>`
Show answer & explanation

`<caption>`

`` sits inside the table and provides a visible title that screen readers announce before the table content.

Q12. Which CSS rule merges adjacent cell borders into a single clean line?

Intermediate
A `border-spacing: 0;` B `border: 1px solid;` C `cellspacing: 0;` D `border-collapse: collapse;`
Show answer & explanation

`border-collapse: collapse;`

`border-collapse: collapse;` merges adjacent cell borders into one clean line. `border-spacing` only controls gaps when borders are not collapsed.

Q13. A student writes a table where the header row uses `<td>` with bold text instead of `<th>`. What is the main problem?

Intermediate
A The cells will not align in columns. B The table will not render at all. C The header loses its semantic meaning for screen readers. D The browser will add extra rows automatically.
Show answer & explanation

The header loses its semantic meaning for screen readers.

`` carries semantic meaning that `` does not. Screen readers announce `` content before related data cells, so using `` breaks accessibility even if the visual style looks the same.

Topper level · 5 questions

Q14. A developer needs to arrange a page header, sidebar, and footer. Which approach is correct?

Advanced
A Use a `<table>` with three cells in one row. B Use CSS Grid or Flexbox for the layout. C Nest three tables inside one another. D Use `<td>` elements directly without a `<table>`.
Show answer & explanation

Use CSS Grid or Flexbox for the layout.

Tables are for tabular data, not page layout. Using tables for layout confuses screen readers, breaks responsiveness, and produces bloated HTML. CSS Grid or Flexbox is the correct tool.

Q15. A table has four rows, each with three cells. A developer adds a fourth cell to one row only. What happens?

Advanced
A The entire grid shifts because cell counts must match across rows. B The extra cell is silently ignored. C The table converts to a list. D The browser adds a fourth column to every row automatically.
Show answer & explanation

The entire grid shifts because cell counts must match across rows.

Columns are implied by cell position, so cell counts must match across rows. An extra cell in one row shifts the entire grid.

Q16. A developer wants to restyle an old table that uses `border="1"`, `cellpadding`, and `cellspacing`. What is the recommended modern approach?

Advanced
A Replace them with `colspan` and `rowspan`. B Move them to the `<tr>` element instead. C Keep the attributes — they are the current standard. D Replace them with CSS properties like `border-collapse` and `padding`.
Show answer & explanation

Replace them with CSS properties like `border-collapse` and `padding`.

Legacy attributes like `border`, `cellpadding`, and `cellspacing` are replaced by CSS. `border-collapse: collapse;` merges borders and `padding` controls cell spacing.

Q17. A developer is creating a table where the header for 'Science' must span three columns: Physics, Chemistry, and Biology. Which of the following implementations correctly uses the `colspan` attribute, and what must the developer remember to do with the other cells in that row?

Advanced
A <th colspan='3'>Science</th> <td></td> <td></td> B <th colspan='3'>Science</th> <td>Physics</td> <td>Chemistry</td> <td>Biology</td> C <th colspan='3'>Science</th> <td>Physics</td> D <th>Science</th> <td colspan='3'>Physics</td>
Show answer & explanation

<th colspan='3'>Science</th> <td></td> <td></td>

The correct implementation is 'Science ' because the developer must remove the cells that would have occupied the positions under the 'Science' header to avoid breaking the grid.

Q18. Consider a long table that requires a footer for totals. Which of the following structures correctly groups the rows into header, body, and footer sections, ensuring that the footer is semantically correct and can be styled separately?

Advanced
A <table><tbody><tr><th>Header</th></tr></tbody><tfoot><tr><td>Total</td></tr></tfoot></table> B <table><tr><th>Header</th></tr><tr><td>Data</td></tr><tr><td>Total</td></tr></table> C <table><thead><tr><th>Header</th></tr></thead><tr><td>Data</td></tr><tfoot><tr><td>Total</td></tr></tfoot></table> D <table><thead><tr><th>Header</th></tr></thead><tbody><tr><td>Data</td></tr></tbody><tfoot><tr><td>Total</td></tr></tfoot></table>
Show answer & explanation

<table><thead><tr><th>Header</th></tr></thead><tbody><tr><td>Data</td></tr></tbody><tfoot><tr><td>Total</td></tr></tfoot></table>

The correct structure is 'HeaderDataTotal' because it properly groups the header, body, and footer sections, allowing for better accessibility and styling.

Make your own

Your notes can be a kit like these

Every kit here was made from real study material. Point Veda at a chapter, a PDF, a photo or a link and get notes, flashcards, practice MCQs, games and a scored test — free, in 42 languages.

  • Chapter notes
  • Flashcards
  • Practice MCQs
  • Scored tests
  • Exam prep

Get Veda free See what students get

Free to start · No ads · Works in 42 languages