Download - HTML Table Tags
![Page 1: HTML Table Tags](https://reader035.vdocument.in/reader035/viewer/2022070521/58efd83d1a28ab72468b45c3/html5/thumbnails/1.jpg)
Presentation
Topic HTML TagsSubject web system Technologies Presented by kainat ilyas #3 UOS FSD women campus
![Page 2: HTML Table Tags](https://reader035.vdocument.in/reader035/viewer/2022070521/58efd83d1a28ab72468b45c3/html5/thumbnails/2.jpg)
HTML Table TagsHTML Table Tags are following:<table><td><tr><th><caption><thead><tbody><tfoot><col><colgroup>
![Page 3: HTML Table Tags](https://reader035.vdocument.in/reader035/viewer/2022070521/58efd83d1a28ab72468b45c3/html5/thumbnails/3.jpg)
<table> Tag• The <table> tag defines an HTML table.• An HTML table consists of the <table> element • <table> closing tag is </table> An HTML table has two kinds of cells:• Header cells - contains header information (created with
the <th> element)• Standard cells - contains data (created with
the <td> element)
![Page 4: HTML Table Tags](https://reader035.vdocument.in/reader035/viewer/2022070521/58efd83d1a28ab72468b45c3/html5/thumbnails/4.jpg)
<th> Tag
• The <th> tag defines a header cell in an HTML table.
• Closing tag is </th>• The text in <th> elements are bold and
centered by default.
![Page 5: HTML Table Tags](https://reader035.vdocument.in/reader035/viewer/2022070521/58efd83d1a28ab72468b45c3/html5/thumbnails/5.jpg)
<td> Tag
• The <td> tag defines a standard cell in an HTML table.
• The text in <td> elements are regular and left-aligned by default
• Closing tag is </td>
![Page 6: HTML Table Tags](https://reader035.vdocument.in/reader035/viewer/2022070521/58efd83d1a28ab72468b45c3/html5/thumbnails/6.jpg)
<tr> Tag
• The <tr> tag defines a row in an HTML table.• A <tr> element contains one or
more <th> or <td> elements.• Closing tag is </th>
![Page 7: HTML Table Tags](https://reader035.vdocument.in/reader035/viewer/2022070521/58efd83d1a28ab72468b45c3/html5/thumbnails/7.jpg)
<table> input
![Page 8: HTML Table Tags](https://reader035.vdocument.in/reader035/viewer/2022070521/58efd83d1a28ab72468b45c3/html5/thumbnails/8.jpg)
<table>output
![Page 9: HTML Table Tags](https://reader035.vdocument.in/reader035/viewer/2022070521/58efd83d1a28ab72468b45c3/html5/thumbnails/9.jpg)
<caption> Tag
• The <caption> tag defines a table caption.• The <caption> tag must be inserted
immediately after the <table> tag.• we can specify only one caption per table.• By default, a table caption will be center-
aligned above a table.• Closing tag is </caption>
![Page 10: HTML Table Tags](https://reader035.vdocument.in/reader035/viewer/2022070521/58efd83d1a28ab72468b45c3/html5/thumbnails/10.jpg)
<caption> input
![Page 11: HTML Table Tags](https://reader035.vdocument.in/reader035/viewer/2022070521/58efd83d1a28ab72468b45c3/html5/thumbnails/11.jpg)
<caption> output
![Page 12: HTML Table Tags](https://reader035.vdocument.in/reader035/viewer/2022070521/58efd83d1a28ab72468b45c3/html5/thumbnails/12.jpg)
<thead> Tag
• The <thead> tag is used to group header content in an HTML table.
• The <thead> element is used in conjunction with the <tbody> and <tfoot> elements to specify each part of a table (header, body, footer).
• The <thead> tag must be used in the following context: As a child of a <table> element, after any <caption>, and <colgroup> elements, and before any <tbody>, <tfoot>, and <tr> elements.
• The <thead> element must have one or more <tr> tags inside.
![Page 13: HTML Table Tags](https://reader035.vdocument.in/reader035/viewer/2022070521/58efd83d1a28ab72468b45c3/html5/thumbnails/13.jpg)
<tbody> Tag
• The <tbody> tag is used to group the body content in an HTML table.
• The <tbody> element is used in conjunction with the <thead> and <tfoot> elements to specify each part of a table (body, header, footer).
• The <tbody> tag must be used in the following context: As a child of a <table> element, after any <caption>, <colgroup>, and <thead> elements.
• The <tbody> element must have one or more <tr> tags inside.
![Page 14: HTML Table Tags](https://reader035.vdocument.in/reader035/viewer/2022070521/58efd83d1a28ab72468b45c3/html5/thumbnails/14.jpg)
<tfoot> Tag
• The <tfoot> tag is used to group footer content in an HTML table.
• The <tfoot> element is used in conjunction with the <thead> and <tbody> elements to specify each part of a table (footer, header, body).
• The <tfoot> tag must be used in the following context: As a child of a <table> element, after any <caption>, <colgroup>, and <thead> elements and before any <tbody> and <tr> elements.
• The <tfoot> element must have one or more <tr> tags inside.
![Page 15: HTML Table Tags](https://reader035.vdocument.in/reader035/viewer/2022070521/58efd83d1a28ab72468b45c3/html5/thumbnails/15.jpg)
Input
![Page 16: HTML Table Tags](https://reader035.vdocument.in/reader035/viewer/2022070521/58efd83d1a28ab72468b45c3/html5/thumbnails/16.jpg)
output
![Page 17: HTML Table Tags](https://reader035.vdocument.in/reader035/viewer/2022070521/58efd83d1a28ab72468b45c3/html5/thumbnails/17.jpg)
<col> Tag
• The <col> tag specifies column properties for each column within a <colgroup> element.
• The <col> tag is useful for applying styles to entire columns, instead of repeating the styles for each cell, for each row.
![Page 18: HTML Table Tags](https://reader035.vdocument.in/reader035/viewer/2022070521/58efd83d1a28ab72468b45c3/html5/thumbnails/18.jpg)
<colgroup> Tag• The <colgroup> tag specifies a group of one or more
columns in a table for formatting.• The <colgroup> tag is useful for applying styles to entire
columns, instead of repeating the styles for each cell, for each row.
• The <colgroup> tag must be a child of a <table> element, after any <caption> elements and before any <thead>, <tbody>, <tfoot>, and <tr> elements.
• To define different properties to a column within a <colgroup>, use the <col> tag within the <colgroup> tag.
![Page 19: HTML Table Tags](https://reader035.vdocument.in/reader035/viewer/2022070521/58efd83d1a28ab72468b45c3/html5/thumbnails/19.jpg)
input
![Page 20: HTML Table Tags](https://reader035.vdocument.in/reader035/viewer/2022070521/58efd83d1a28ab72468b45c3/html5/thumbnails/20.jpg)
output
![Page 21: HTML Table Tags](https://reader035.vdocument.in/reader035/viewer/2022070521/58efd83d1a28ab72468b45c3/html5/thumbnails/21.jpg)
Row span input
![Page 22: HTML Table Tags](https://reader035.vdocument.in/reader035/viewer/2022070521/58efd83d1a28ab72468b45c3/html5/thumbnails/22.jpg)
Rowspan output
![Page 23: HTML Table Tags](https://reader035.vdocument.in/reader035/viewer/2022070521/58efd83d1a28ab72468b45c3/html5/thumbnails/23.jpg)
Colspan input
![Page 24: HTML Table Tags](https://reader035.vdocument.in/reader035/viewer/2022070521/58efd83d1a28ab72468b45c3/html5/thumbnails/24.jpg)
Colspan output
![Page 25: HTML Table Tags](https://reader035.vdocument.in/reader035/viewer/2022070521/58efd83d1a28ab72468b45c3/html5/thumbnails/25.jpg)
Any Question?