table
Table may refer to:
* Table (database), how the table data arrangement is used within the databases
* Table (furniture), a piece of furniture with a flat surface and one or more legs
* Table (information), a data arrangement with rows and column ...
used for storing information or data. Cells are grouped horizontally (rows of cells) and vertically (columns of cells). Each cell contains information relating to the combination of the row and column headings it is collinear with. In
software design
Software design is the process of conceptualizing how a software system will work before it is implemented or modified.
Software design also refers to the direct result of the design process the concepts of how the software will work which co ...
, table cells are a key
component
Component may refer to:
In engineering, science, and technology Generic systems
*System components, an entity with discrete structure, such as an assembly or software module, within a system considered at a particular level of analysis
* Lumped e ...
in
HTML
Hypertext Markup Language (HTML) is the standard markup language for documents designed to be displayed in a web browser. It defines the content and structure of web content. It is often assisted by technologies such as Cascading Style Sheets ( ...
and
webpage
A web page (or webpage) is a Web document that is accessed in a web browser. A website typically consists of many web pages linked together under a common domain name. The term "web page" is therefore a metaphor of paper pages bound together in ...
building, and it is part of the
component. A coder may specify dimensions for a table cell, and use them to hold sections of webpages.
HTML usage
Kinds of cell in HTML
A table cell in HTML is a non-empty element and should always be closed. There are two different kinds of table cell in HTML: normal table cell and header cell. <td> denotes a table cell, the name implying 'data', while <th> denotes a table 'header'. The two can be used interchangeably, but it is recommended that header cell be only used for the top and side headers of a table.
Syntax
A table cell also must be nested within a <table> tag ''and'' a <tr> (table row) tag. If there are more table cell tags in any given row than in any other, the particular <tr> must be given a attribute declaring how many columns of cells wide it should be.
Example
An example of an HTML table containing 4 cells:
Cell 1
Cell 2
Cell 3
Cell 4
HTML source:
Cell 1
Cell 2
Cell 3
Cell 4
Colspan and rowspan
Every row must have the same number of table data cells, occasionally table data cells have to span more than one column or row. In this case the tags colspan and/or rowspan are used - where they are set to a number.
{, width="80%" align="center" style="font-variant:small-caps"
, -
, style="background:var(--background-color-inverted, black)" width="5%",
, style="background:var(--background-color-inverted, black)" width="5%",
, style="background:var(--background-color-inverted, black)" width="5%",
, border="none", <-- ''This row has three'' table data cells
, -
, colspan="2" style="background:var(--background-color-progressive, blue);",
, style="background:var(--background-color-inverted, black)",
, border="none", <-- ''This row has two. The first uses'' colspan="2"
, -
, rowspan="2" style="background:var(--background-color-destructive, red)",
, style="background:var(--background-color-inverted, black)",
, style="background:var(--background-color-inverted, black)",
, border="none", <-- ''This row has three table data cells, but one spans two rows because it uses'' rowspan="2"
, -
, style="background:var(--background-color-inverted, black)",
, style="background:var(--background-color-inverted, black)",
, border="none", <-- ''This row has only two table data cells, because its first is being taken up