• Skip to main content
  • Skip to search
  • Skip to select language
MDN Web Docs
  • References
    • Overview / Web Technology

      Web technology reference for developers

    • HTML

      Structure of content on the web

    • CSS

      Code used to describe document style

    • JavaScript

      General-purpose scripting language

    • HTTP

      Protocol for transmitting web resources

    • Web APIs

      Interfaces for building web applications

    • Web Extensions

      Developing extensions for web browsers

    • Accessibility

      Build web projects usable for all

    • Web Technology

      Web technology reference for developers

  • Learn
    • Overview / MDN Learning Area

      Learn web development

    • MDN Learning Area

      Learn web development

    • HTML

      Learn to structure web content with HTML

    • CSS

      Learn to style content using CSS

    • JavaScript

      Learn to run scripts in the browser

    • Accessibility

      Learn to make the web accessible to all

  • Plus
    • Overview

      A customized MDN experience

    • AI Help

      Get real-time assistance and support

    • Updates

      All browser compatibility updates at a glance

    • Documentation

      Learn how to use MDN Plus

    • FAQ

      Frequently asked questions about MDN Plus

  • Curriculum New
  • Blog
    • Playground

      Write, test and share your code

    • HTTP Observatory

      Scan a website for free

    • AI Help

      Get real-time assistance and support

  • Log in
  • Sign up for free
  1. References
  2. HTML
  3. Reference
  4. Elements
    • Deutsch
    • Français
    • 日本語
    • 한국어
    • 中文 (简体)

In this article

  • Try it
  • Attributes
  • Usage notes
  • Examples
  • Technical summary
  • Specifications
  • Browser compatibility
  • See also
  1. HTML
  2. Guides
  3. Content categories
  4. Comments
  5. Date and time formats
  6. Constraint validation
  7. Viewport meta element
  8. Responsive images
  9. Microdata
  10. Microformats
  11. Quirks and standards modes
  12. HTML cheatsheet
  13. How to
  14. Define terms with HTML
  15. Use data attributes
  16. Use cross-origin images
  17. Add a hitmap on top of an image
  18. Author fast-loading HTML pages
  19. Add JavaScript
  20. Reference
  21. Elements
    3. Deprecated
    13. Deprecated

    20. Deprecated
    32. Deprecated
    38. Experimental
    42. Deprecated
    45. Deprecated
    46. Deprecated

Multiple head rows

This example demonstrates a table head section with two rows.

HTML

We extend the markup the table from the basic example in this example by including two table rows () within the element creating a multi-row table head. We included an additional column, splitting the student names into first and last names.

html

  
    

      Student ID
      Student
      Major
      Credits
    

    

      First name
      Last name
    

  
  
    

      3741255
      Martha
      Jones
      Computer Science
      240
    

    

      3971244
      Victor
      Nim
      Russian Literature
      220
    

    

      4100332
      Alexandra
      Petrov
      Astrophysics
      260

Cell spanning

In order to associate and line up the header cells with the correct columns and rows, the colspan and rowspan attributes are used on the elements. The values set in these attributes specify how many cells each header cell () spans. Due to the way these attributes are set, the two second-row header cells are lined up with the columns they head. These each span one row and one column as the default values for the colspan and rowspan attributes are both 1.

The column and row spanning demonstrated by this example are illustrated in the following figure:

Illustration demonstrating column and row spanning of table cells: cells 1, 3, and 4 spanning one column and two rows each; cell 2 spanning two columns and one row; cells 5 and 6 span a single row and column each, fitting into the available cells that are the second and third columns in the second row

CSS

The CSS is unchanged from the previous example.

thead {
  border-bottom: 2px solid rgb(160 160 160);
  background-color: #2c5e77;
  color: #fff;
}

table {
  border-collapse: collapse;
  border: 2px solid rgb(140 140 140);
  font-family: sans-serif;
  font-size: 0.8rem;
  letter-spacing: 1px;
}

tbody {
  background-color: #e4f0f5;
}

th,
td {
  border: 1px solid rgb(160 160 160);
  padding: 8px 10px;
}

tbody > tr > td:last-of-type {
  text-align: center;
}

Result

Technical summary

elements. element is immediately followed by a or element. , ,
Content categories None.
Permitted content Zero or more
Tag omission The start tag is mandatory. The end tag may be omitted if the
Permitted parents A element. The must appear after any elements, even implicitly defined, but before any , , and elements.
and
Implicit ARIA role rowgroup
Permitted ARIA roles Any
DOM interface HTMLTableSectionElement

Specifications

Specification
HTML
# the-thead-element

Browser compatibility

See also

  • Learn: HTML table basics
,
, , , : Other table-related elements
  • background-color: CSS property to set the background color of each head cell
  • border: CSS property to control borders of head cells
  • text-align: CSS property to horizontally align each head cell content
  • vertical-align: CSS property to vertically align each head cell content

    • Help improve MDN

    Learn how to contribute.

    This page was last modified on Jun 10, 2025 by MDN contributors.

    View this page on GitHub • Report a problem with this content
    MDN logo

    Your blueprint for a better internet.

    • MDN on Bluesky
    • MDN on Mastodon
    • MDN on X (formerly Twitter)
    • MDN on GitHub
    • MDN Blog RSS Feed

    MDN

    • About
    • Blog
    • Careers
    • Advertise with us

    Support

    • Product help
    • Report an issue

    Our communities

    • MDN Community
    • MDN Forum
    • MDN Chat

    Developers

    • Web Technologies
    • Learn Web Development
    • MDN Plus
    • Hacks Blog
    • Website Privacy Notice
    • Cookies
    • Legal
    • Community Participation Guidelines

    Visit Mozilla Corporation’s not-for-profit parent, the Mozilla Foundation.
    Portions of this content are ©1998–2025 by individual mozilla.org contributors. Content available under a Creative Commons license.

    ,
    ,