Header cells are supposed to provide header information for data cells td. Therefore, it's common to find this type of cells inside rows tr that are part of the header thead or footer tfoot sections of a table. The attributes colspan and rowspan can be used to make cells span two or more adjacent cells in horizontal or vertical direction, respectively.
The th element, along with the td element , can only be present as child of a tr element. In previous versions of the standard, the th element had several presentational attributes that have been removed in the HTML5 specification. Authors should drop their use in favor of style sheets. The following example represents a table with a number of rows containing data cells td and header cells th. Now, we'll make a couple of cells span the space of others in the same row. This is a very easy task, as we just need to specify how many cells to the right we'll be spanning in the colspan attribute and then continue declaring cells taking into account the number of cells spanned.
Lastly, we'll unify some cells in the same column. This time, you'll have to pay attention to the spanned cells when defining the following rows, to avoid declaring more cells than needed.
This may be a little confusing at first, because of the structure of HTML tables that consist of a set of rows and not columns containing cells. Additionally, we're making use of the scope attribute in the cell located at the top-left corner of the table , to make sure the user agent understands for which cells it's providing header information to the cells in the same column.
Note how in the third and fifth rows of the previous example, we've declared only two cell, although the table has three columns. This is so, because the first cell in the second and fourth row have spanned the ones below the ones that haven't been declared. When used together in a table , the attributes colspan and rowspan must be carefully declared in a way that doesn't produce overlaping cells.
The number of cells to the right this cell should span. As result, this cell will have a width equal to its original width plus the width of the cells it's spanning.
The number of cells to the bottom this cell should span. If this attribute takes the value zero "0" , this cell will span all remaining cells in the row group thead , tbody or tfoot. As result, this cell will have a height equal to its height plus the height of the cells it's spanning. A space-separated list of unique tokens, each of which matches the id attribute of a header cell th in the same table.
The header cells pointed in this attribute are supposed to provide header information for this cell. This attribute is rarely needed, and is only required in very complex tables. In most cases the scope attribute of header cells th will be enough to achieve accessible tables. A group of cells for which this cell provides header information.
Possible values case-insensitive are:. In most cases, the scope attribute can be omitted to let the browser deduct the cells affected by the header. But when exists any chance of ambiguity, the presence of this attribute is highly recommended. An alternative to the cell's content, that may be used by browsers when appropriate like, for example, when describing the headers that apply to a particular cell.
The value of this attribute is typically a shorter version of the cell's content, but could also give an alternative or complementary description. A list of comma-separated category names to which this cell belongs. This attribute contains a non-negative integer value that indicates for how many rows the cell extends. Values higher than are clipped down to It may have the following values:. If the scope attribute is not specified, or its value is not row , col , or rowgroup , or colgroup , then browsers automatically select the set of cells to which the header cell applies.
This enumerated attribute specifies how the cell content's horizontal alignment will be handled. Possible values are:. This attribute contains a list of space-separated strings. Each string is the id of a group of cells that this header applies to. Note: Do not use this attribute as it is obsolete in the latest standard: use the scope attribute instead. This attribute defines the background color of each cell in a column. It consists of a 6-digit hexadecimal code as defined in sRGB and is prefixed by ' '.
This attribute may be used with one of sixteen predefined color strings:. To create a similar effect use the background-color property in CSS instead. The content in the cell element is aligned to a character. Typical values include a period. If align is not set to char , this attribute is ignored. Note: Do not use this attribute as it is obsolete in the latest standard. To achieve the same effect, you can specify the character as the first value of the text-align property.
This attribute is used to shift column data to the right of the character specified by the char attribute. Its value specifies the length of this shift. Note: Do not use this attribute as it is obsolete in the latest standard: use the CSS height property instead.
This attribute specifies how a text is vertically aligned inside a cell.
0コメント