html5 Site Icon CSS3 Site Icon CSS Site Icon

HTML4 Reference

HTML <td> tag

Definition

The <td> tag is used to define a table cell within a table and must be enclosed within the <tr></tr> element.

Example


<table>
  <tr>
    <th>Fruit</th>
    <th>Colour</th>
  </tr>
  <tr>
    <td>Banana</td>
    <td>Yellow</td>
  </tr>
  <tr>
    <td>Pea</td>
    <td>Green</td>
  </tr>
</table>

Required Attributes

NONE

Optional Attributes

axis no browser support - specifies a relationship between columns.

bgcolor this attribute is deprecated - use CSS instead.

char no browser support - specifies character to align cells to.

charoff no browser support - specifies offset of char character in pixels.

height this attribute is deprecated - use CSS instead.

nowrap this attribute is deprecated - use CSS instead.

width this attribute is deprecated - use CSS instead.

abbr specifies abbreviated version of a cells contents.


<td abbr="someValue">Table data content here</td> 

align specifies the horizontal alignment of cell contents.


<td align="left">Table data content here</td>   <!-- align content to the left -->
<td align="center">Table data content here</td>   <!-- align content in the centre -->
<td align="right">Table data content here</td>   <!-- align content to the right -->
<td align="justify">Table data content here</td>   <!-- stretch contents to width -->
<td align="char">Table data content here</td>   <!-- align content to a character -->

colspan specifies the number of columns a heading should span.


<td colspan="3">Table data content here</td>

headers specifies a table header related to a cell.


<td headers="someValue">Table data content here</td> 

rowspan specifies the number of rows a heading should span.


<td rowspan="3">Table data content here</td>

scope specifies a way to associate columns and rows with heading information.


<td scope="col">Table data content here</td>   <!-- cell is a column header -->
<td scope="colgroup">Table data content here</td>   <!-- cell is a column group header -->
<td scope="row">Table data content here</td>   <!-- cell is a row header -->
<td scope="rowgroup">Table data content here</td>   <!-- cell is a row group header -->

valign specifies the vertical alignment of cell contents.


<td valign="top">Table data content here</td>   <!-- align content to the top -->
<td valign="middle">Table data content here</td>   <!-- align content in the middle -->
<td valign="bottom">Table data content here</td>   <!-- align content to the bottom -->
<td valign="baseline">Table data content here</td>   <!-- bottom align different fonts -->

Common Attributes

class - specifies a classname for the element allowing you to apply the style of the predefined class to the content.


<td class="classname">Table data content here</td>

id - specifies a unique id for the element allowing you to apply the style of the predefined id to the content.


<td id="idname">Table data content here</td>

style - specifies an inline style for the element allowing you to apply the style to the content.


<td style="color:red;text-align:left">Table data content here</td>

title - specifies extra information about the content.


<td title="information about the content">Table data content here</td>

Language Attributes

dir - specifies the directional flow of the content.


<!-- The text will flow from left to right -->
<td dir="ltr">Table data content here</td>

<!-- The text will flow from right to left -->
<td dir="rtl">Table data content here</td>

lang - specifies a language code for the content of the element.


<td lang="en">Table data content here</td>

xml:lang - specifies a language code for the content of the element in XHTML documents.


<td xml:lang="fr">Table data content here</td>

Document Event Attributes

NONE

Form Event Attributes

NONE

Image Event Attributes

NONE

Keyboard Event Attributes

onkeydown - The JavaScript code to be run when an element is in focus and keyboard key is pressed.


<!-- Executes the go() function -->
<td onkeydown="go()">Table data content here</td>

onkeypress - The JavaScript code to be run when an element is in focus and keyboard key is pressed down and released.


<!-- Executes the go() function -->
<td onkeypress="go()">Table data content here</td>

onkeyup - The JavaScript code to be run when an element is in focus and keyboard key is released.


<!-- Executes the go() function -->
<td onkeyup="go()">Table data content here</td>

Mouse Event Attributes

onclick - The JavaScript code to be run when a mouse is clicked on the element.


<!-- Executes the go() function -->
<td onclick="go()">Table data content here</td>

ondblclick - The JavaScript code to be run when a mouse is double clicked on the element.


<!-- Executes the go() function -->
<td ondblclick="go()">Table data content here</td>

onmousedown - The JavaScript code to be run when the mouse button is pressed down while the cursor is over the element.


<!-- Executes the go() function -->
<td onmousedown="go()">Table data content here</td>

onmousemove - The JavaScript code to be run when the mouse button is moved.


<!-- Executes the go() function -->
<td onmousemove="go()">Table data content here</td>

onmouseout - The JavaScript code to be run when the mouse cursor moves off an element.


<!-- Executes the go() function -->
<td onmouseout="go()">Table data content here</td>

onmouseover - The JavaScript code to be run when the mouse cursor moves over an element.


<!-- Executes the go() function -->
<td onmouseover="go()">Table data content here</td>

onmouseup - The JavaScript code to be run when the mouse button is released while the cursor is over the element.


<!-- Executes the go() function -->
<td onmouseup="go()">Table data content here</td>


<tbody> tag    << Prev          Next >>   <textarea> tag

go to home page Homepage go to top of page Top

HTML Elements

The complete set of HTML elements also known as HTML tags from the latest HTML 4.01 Specification.

Click the links for more information on individual tags and their attributes.

<!--...-->

<!DOCTYPE>

<a>

<abbr>

<acronym>

<address>

<applet>

<area />

<b>

<base />

<basefont />

<bdo>

<big>

<blockquote>

<body>

<br />

<button>

<caption>

<center>

<cite>

<code>

<col />

<colgroup>

<dd>

<del>

<dfn>

<dir>

<div>

<dl>

<dt>

<em>

<fieldset>

<font>

<form>

<frame />

<frameset>

<h1> - <h6>

<head>

<hr />

<html>

<i>

<iframe>

<img />

<input />

<ins>

<isindex />

<kbd>

<label>

<legend>

<li>

<link />

<map>

<menu>

<meta />

<noframes>

<noscript>

<object>

<ol>

<optgroup>

<option>

<p>

<param />

<pre>

<q>

<s>

<samp>

<script>

<select>

<small>

<span>

<strike>

<strong>

<style>

<sub>

<sup>

<table>

<tbody>

<td>

<textarea>

<tfoot>

<th>

<thead>

<title>

<tr>

<tt>

<u>

<ul>

<var>