---
title: '<figure>: תגית לעטיפת תמונה או גרף'
slug: Web/HTML/Element/figure
translation_of: Web/HTML/Element/figure
---
<div>{{HTMLRef}}</div>

<p dir="rtl">תגית <strong><code>&lt;figure&gt;</code></strong> היא תגית עצמאית העוטפת תמונה או גרף במסמך ה-HTML ומאפשרת להוסיף להם כותרת באמצעות תגית משלימה <a href="/he/docs/Web/HTML/Element/figcaption">&lt;figcaption&gt;</a>.</p>

<div>{{EmbedInteractiveExample("pages/tabbed/figure.html", "tabbed-standard")}}</div>

<p class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a> and send us a pull request.</p>

<p> </p>

<table>
 <tbody>
  <tr>
   <th>קטגוריה</th>
   <td>תגיות להזנת תוכן.</td>
  </tr>
  <tr>
   <th>תוכן מורשה</th>
   <td>
    <p>&lt;figcaption&gt;,&lt;img&gt;,&lt;abbr&gt;, &lt;audio&gt;, &lt;b&gt;, &lt;bdo&gt;, &lt;br&gt;, &lt;button&gt;, &lt;canvas&gt;, &lt;cite&gt;, &lt;code&gt;, &lt;command&gt;, &lt;data&gt;, &lt;datalist&gt;, &lt;dfn&gt;, &lt;em&gt;, &lt;embed&gt;, &lt;i&gt;, &lt;iframe&gt;, &lt;img&gt;, &lt;input&gt;, &lt;kbd&gt;, &lt;keygen&gt;, &lt;label&gt;, &lt;mark&gt;, &lt;math&gt;, &lt;meter&gt;, &lt;noscript&gt;, &lt;object&gt;, &lt;output&gt;, &lt;progress&gt;, &lt;q&gt;, &lt;ruby&gt;, &lt;samp&gt;, &lt;script&gt;, &lt;select&gt;, &lt;small&gt;, &lt;span&gt;, &lt;strong&gt;, &lt;sub&gt;, &lt;sup&gt;, &lt;svg&gt;, &lt;textarea&gt;, &lt;time&gt;, &lt;var&gt;, &lt;video&gt;, &lt;wbr&gt;</p>
   </td>
  </tr>
  <tr>
   <th>תגיות הורים מורשות</th>
   <td>תגית זו מורשת להופיע בגוף המסמך אך אינה חייבת להיות כפופה בצורה ישירה אל תגית {{HTMLElement("body")}}.</td>
  </tr>
  <tr>
   <th scope="row">ממשק DOM</th>
   <td>{{domxref("HTMLElement")}}</td>
  </tr>
 </tbody>
</table>

<h2 dir="rtl" id="תארים">תארים</h2>

<p dir="rtl">תגית זו נכללת ברשימת <a href="https://developer.mozilla.org/he/docs/Web/HTML/%D7%AA%D7%90%D7%A8%D7%99%D7%9D_%D7%92%D7%9C%D7%95%D7%91%D7%9C%D7%99%D7%99%D7%9D">התארים הגלובליים</a>.</p>

<dl>
 <dt dir="rtl">
 <h2 dir="rtl" id="דוגמא_-_תמונה">דוגמא - תמונה</h2>


 <figure>
 <pre class="brush: html">&lt;!-- Just an image --&gt;
&lt;figure&gt;
  &lt;img
  src="https://developer.mozilla.org/static/img/favicon144.png"
  alt="A robotic monster over the letters MDN."&gt;
&lt;/figure&gt;

&lt;!-- Image with a caption --&gt;
&lt;figure&gt;
  &lt;img
  src="https://developer.mozilla.org/static/img/favicon144.png"
  alt="A robotic monster over the letters MDN."&gt;
  &lt;figcaption&gt;MDN Logo&lt;/figcaption&gt;
&lt;/figure&gt;

</pre>

 <h2 dir="rtl" id="דוגמא_-_קטע_קוד">דוגמא - קטע קוד</h2>


 <figure>
 <pre class="brush: html">&lt;figure&gt;
  &lt;figcaption&gt;Get browser details using &lt;code&gt;navigator&lt;/code&gt;.&lt;/figcaption&gt;
  &lt;pre&gt;
function NavigatorExample() {
  var txt;
  txt = "Browser CodeName: " + navigator.appCodeName;
  txt+= "Browser Name: " + navigator.appName;
  txt+= "Browser Version: " + navigator.appVersion ;
  txt+= "Cookies Enabled: " + navigator.cookieEnabled;
  txt+= "Platform: " + navigator.platform;
  txt+= "User-agent header: " + navigator.userAgent;
}&lt;/pre&gt;
&lt;/figure&gt;
</pre>
 </figure>

 <h2 dir="rtl" id="דוגמא_-_שיר">דוגמא - שיר</h2>


 <figure>
 <pre class="brush: html">&lt;figure&gt;
  &lt;p style="white-space:pre"&gt;
Bid me discourse, I will enchant thine ear,
  Or like a fairy trip upon the green,
Or, like a nymph, with long dishevell'd hair,
  Dance on the sands, and yet no footing seen:
Love is a spirit all compact of fire,
  Not gross to sink, but light, and will aspire.&lt;/p&gt;
  &lt;figcaption&gt;&lt;cite&gt;Venus and Adonis&lt;/cite&gt;,
    by William Shakespeare&lt;/figcaption&gt;
&lt;/figure&gt;</pre>
 </figure>

 <p> </p>
 </figure>
 </dt>
</dl>

<h2 dir="rtl" id="ראה_גם">ראה גם</h2>

<ul>
 <li>{{HTMLElement("figcaption")}}</li>
</ul>