---
title: <tr>
slug: Web/HTML/Element/tr
translation_of: Web/HTML/Element/tr
---
<h2 id="개요">개요</h2>

<p>The <em>HTML Table Row Element</em> (<code>&lt;tr&gt;</code>) defines a row of cells in a table. Those can be a mix of {{HTMLElement("td")}} and {{HTMLElement("th")}} elements.</p>

<h2 id="사용_문맥">사용 문맥</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <td><a href="/en-US/docs/HTML/Content_categories" title="HTML/Content categories">콘텐츠 범주</a></td>
   <td>None.</td>
  </tr>
  <tr>
   <td>허용되는 콘텐츠</td>
   <td>Zero or more {{HTMLElement("td")}} or {{HTMLElement("th")}} elements, or a mix of them</td>
  </tr>
  <tr>
   <td>태그 생략</td>
   <td>The start tag is mandatory. The end tag may be omitted if the {{HTMLElement("tr")}} element is immediately followed by a {{HTMLElement("tr")}} element, or if the parent table group ({{HTMLElement("thead")}}, {{HTMLElement("tbody")}} or {{HTMLElement("tfoot")}}) element doesn't have any more content.</td>
  </tr>
  <tr>
   <td>허용되는 부모 요소</td>
   <td>A {{HTMLElement("table")}}, {{HTMLElement("thead")}}, {{HTMLElement("tbody")}} or {{HTMLElement("tfoot")}} element.</td>
  </tr>
  <tr>
   <td>Normative document</td>
   <td><a class="external" href="http://www.whatwg.org/html/#the-tr-element">HTML, "The <code>tr</code> element"</a></td>
  </tr>
 </tbody>
</table>

<h2 id="속성">속성</h2>

<p><span style="line-height: 21px;">This element includes the </span><a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes" style="line-height: 21px;" title="HTML/Global attributes">global attributes</a><span style="line-height: 21px;">.</span></p>

<dl>
 <dt>{{htmlattrdef("align")}} {{deprecatedGeneric("inline","html4.01")}}, {{obsoleteGeneric("inline","html5")}}</dt>
 <dd>This enumerated attribute specifies how horizontal alignment of each cell content will be handled. Possible values are:
 <ul>
  <li><code>left</code>, aligning the content to the left of the cells</li>
  <li><code>center</code>, centering the content in the cells</li>
  <li><code>right</code>, aligning the content to the right of the cells</li>
  <li><code>justify</code>, widening the spaces in the textual content so that the content is justified in the cells</li>
  <li><code>char</code>, aligning the textual content on a special character with a minimal offset, defined by the {{htmlattrxref("char", "tr")}} and {{htmlattrxref("charoff", "tr")}} attributes {{unimplemented_inline("2212")}}.</li>
 </ul>

 <p>If this attribute is not set, the parent node's value is inherited.</p>

 <div class="note"><strong>참고: </strong>Do not use this attribute as it is obsolete (not supported) in the latest standard.

 <ul>
  <li>To achieve the same effect as the <code>left</code>, <code>center</code>, <code>right</code> or <code>justify</code> values, use the CSS {{cssxref("text-align")}} property on it.</li>
  <li>To achieve the same effect as the <code>char</code> value, in CSS3, you can use the value of the {{htmlattrxref("char", "tr")}} as the value of the {{cssxref("text-align")}} property {{unimplemented_inline}}.</li>
 </ul>
 </div>
 </dd>
</dl>

<dl>
 <dt>{{htmlattrdef("bgcolor")}} {{deprecatedGeneric("inline","html4.01")}}, {{obsoleteGeneric("inline","html5")}}</dt>
 <dd>This attribute defines the background color of each cell of the row. It can be either an <a href="/en-US/docs/CSS/color_value#HTML.2fSVG.2fX11.c2.a0_Color_Keywords" title="CSS/color value#HTML.2fSVG.2fX11.c2.a0 Color Keywords">#RRGGBB code</a> or an <a href="/#HTML.2fSVG.2fX11.c2.a0_Color_Keywords" title="#HTML.2fSVG.2fX11.c2.a0 Color Keywords">SVG color keyword</a>.
 <div class="note"><strong>Usage note: </strong>the {{HTMLElement("tr")}} element should be styled using <a href="/en-US/docs/CSS" title="CSS">CSS</a>. To give a similar effect to the <strong>bgcolor</strong> attribute, use the <a href="/en-US/docs/CSS" title="CSS">CSS</a> property {{cssxref("background-color")}}.</div>
 </dd>
</dl>

<dl>
 <dt>{{htmlattrdef("char")}} {{deprecatedGeneric("inline","html4.01")}}, {{obsoleteGeneric("inline","html5")}}</dt>
 <dd>This attribute is used to set the character to align the cells in a column on. Typical values for this include a period (.) when attempting to align numbers or monetary values. If {{htmlattrxref("align", "tr")}} is not set to <code>char</code>, this attribute is ignored.
 <div class="note"><strong>참고: </strong>Do not use this attribute as it is obsolete (and not supported) in the latest standard. To achieve the same effect as the {{htmlattrxref("char", "tr")}}, in CSS3, you can use the character set using the {{htmlattrxref("char", "tr")}} attribute as the value of the {{cssxref("text-align")}} property {{unimplemented_inline}}.</div>
 </dd>
</dl>

<dl>
 <dt>{{htmlattrdef("charoff")}} {{deprecatedGeneric("inline","html4.01")}}, {{obsoleteGeneric("inline","html5")}}</dt>
 <dd>This attribute is used to indicate the number of characters to offset the column data from the alignment characters specified by the <strong>char</strong> attribute.
 <div class="note"><strong>참고: </strong>Do not use this attribute as it is obsolete (and not supported) in the latest standard.</div>
 </dd>
</dl>

<dl>
 <dt>{{htmlattrdef("valign")}} {{deprecatedGeneric("inline","html4.01")}}, {{obsoleteGeneric("inline","html5")}}</dt>
 <dd>This attribute specifies the vertical alignment of the text within each row of cells of the table header. Possible values for this attribute are:
 <ul>
  <li><code>baseline</code>, which will put the text as close to the bottom of the cell as it is possible, but align it on the <a class="external" href="http://en.wikipedia.org/wiki/Baseline_%28typography%29" title="http://en.wikipedia.org/wiki/Baseline_(typography)">baseline</a> of the characters instead of the bottom of them. If characters are all of the size, this has the same effect as <code>bottom</code>.</li>
  <li><code>bottom</code>, which will put the text as close to the bottom of the cell as it is possible;</li>
  <li><code>middle</code>, which will center the text in the cell;</li>
  <li>and <code>top</code>, which will put the text as close to the top of the cell as it is possible.</li>
 </ul>

 <div class="note"><strong>Note: </strong>Do not use this attribute as it is obsolete (and not supported) in the latest standard: instead set the CSS {{cssxref("vertical-align")}} property on it.</div>
 </dd>
</dl>

<h2 id="DOM_인터페이스">DOM 인터페이스</h2>

<p>This element implements the {{domxref("HTMLTableRowElement")}} interface.</p>

<h2 id="예제">예제</h2>

<p>See {{HTMLElement("table")}} for examples on <code>&lt;tr&gt;</code>.</p>

<h2 id="브라우저_호환성">브라우저 호환성</h2>

<p>{{CompatibilityTable}}</p>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>기능</th>
   <th>Chrome</th>
   <th>Firefox (Gecko)</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>1.0</td>
   <td>{{CompatGeckoDesktop("1.0")}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
  </tr>
  <tr>
   <td><code>align/valign</code> 속성</td>
   <td>1.0</td>
   <td>{{CompatNo}} {{bug("915")}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
  </tr>
  <tr>
   <td><code>char/charoff</code> 속성</td>
   <td>1.0</td>
   <td>{{CompatNo}} {{bug("2212")}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
  </tr>
  <tr>
   <td><code>bgcolor</code> 속성 {{Non-standard_inline}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>기능</th>
   <th>Android</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>IE Mobile</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatGeckoMobile("1.0")}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
  </tr>
  <tr>
   <td><code>align/valign</code> 속성</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatNo}} {{bug("915")}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatUnknown}}</td>
  </tr>
  <tr>
   <td><code>char/charoff</code> 속성</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatNo}} {{bug("2212")}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatUnknown}}</td>
  </tr>
  <tr>
   <td><code>bgcolor</code> 속성 {{Non-standard_inline}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
  </tr>
 </tbody>
</table>
</div>

<h2 id="같이_보기">같이 보기</h2>

<ul>
 <li>Other table-related HTML Elements: {{HTMLElement("caption")}}, {{HTMLElement("col")}}, {{HTMLElement("colgroup")}}, {{HTMLElement("table")}}, {{HTMLElement("tbody")}}, {{HTMLElement("td")}}, {{HTMLElement("tfoot")}}, {{HTMLElement("th")}}, {{HTMLElement("thead")}};</li>
 <li>CSS properties and pseudo-classes that may be specially useful to style the <code>&lt;tr&gt;</code> element:
  <ul>
   <li>the {{cssxref(":nth-child")}} pseudo-class to set the alignment on the cells of the column;</li>
   <li>the {{cssxref("text-align")}} property to align all cells content on the same character, like '.'.&lt;</li>
  </ul>
 </li>
</ul>

<p>{{HTMLRef}}</p>