Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML HTML Tables Table Basics The Table Header Cell Element

Sina Maleki
Sina Maleki
6,135 Points

<th> and scope attribute benefit

As all you've seen, after adding <th> with scope attribute in a code there is no change in preview, what is the benefits of using this tag in our table? Cheers,

3 Answers

Hello. the <th> tag creates a table header cell element. The text inside <th> elements are bold and centered by default, but the text inside <td> elements are regular and left aligned. ** <th> element is used only for the headings of the table so that people can identify what is the heading and what is the content ** The scope attribute identifies whether a cell is a header for a column, row, or group of columns or rows.

These may not bring up any visual changes but when search engines crawl through ur website it helps them to identify what is the header and what is the content. and also this helps people using screen readers Mark my answer as the best if i managed to help u

Emmanuel Molina
Emmanuel Molina
9,268 Points

Don't forget that with CSS you can target different tag to apply different styles. For example if you use td everywhere how do you put every header in bold ? If your headers are tagged with th it's easier.

If you want to make the header in the top row bold, adding this to your .css seems to work

  th[scope="col"] {
  font-weight: bold; 
  }