<figure>
  <code>
    p {
      color: #333;
      font-family: Helvetica, sans-serif;
      font-size: 1rem;
    }
  </code>
</figure>

嵌套元素是可以接受的。 使用ARIA屬性可以進(jìn)一步改善語(yǔ)義：

figure有效的小提琴用法：

<figure role="group">
  <figcaption>Dog breeds</figcaption>
  <figure>
    <img src="/static/imghw/default1.png"  data-src="https://img.php.cn/upload/article/000/000/000/174018847332126.jpg"  class="lazy" alt="Quick Tip: The Right Way to Use Figure & Figcaption Elements " />
    <figcaption>Adorable Maltese Terrier</figcaption>
  </figure>
  <figure>
    <img src="/static/imghw/default1.png"  data-src="https://img.php.cn/upload/article/000/000/000/174018847481580.jpg"  class="lazy" alt="Quick Tip: The Right Way to Use Figure & Figcaption Elements " />
    <figcaption>Cute black labrador</figcaption>
  </figure>
</figure>

元素為提供了標(biāo)題或傳說(shuō)。雖然並非總是必要的，但是當(dāng)使用時(shí)，應(yīng)該將其放置在>中的內(nèi)容之前或之後。

figcaption figure figure豐富的花captions：

<figure>
  <figcaption>Three different breeds of dog.</figcaption>
  <img src="/static/imghw/default1.png"  data-src="https://img.php.cn/upload/article/000/000/000/174018847332126.jpg"  class="lazy" alt="Quick Tip: The Right Way to Use Figure & Figcaption Elements " />
  <img src="/static/imghw/default1.png"  data-src="https://img.php.cn/upload/article/000/000/000/174018847481580.jpg"  class="lazy" alt="Quick Tip: The Right Way to Use Figure & Figcaption Elements " />
  <img src="/static/imghw/default1.png"  data-src="https://img.php.cn/upload/article/000/000/000/174018847567268.jpg"  class="lazy" alt="Quick Tip: The Right Way to Use Figure & Figcaption Elements " />
</figure>

有關(guān)更詳細(xì)的字幕，包括標(biāo)題和段落：>

<figure>
  <img src="/static/imghw/default1.png"  data-src="https://img.php.cn/upload/article/000/000/000/174018847332126.jpg"  class="lazy" alt="Quick Tip: The Right Way to Use Figure & Figcaption Elements " />
  <img src="/static/imghw/default1.png"  data-src="https://img.php.cn/upload/article/000/000/000/174018847481580.jpg"  class="lazy" alt="Quick Tip: The Right Way to Use Figure & Figcaption Elements " />
  <img src="/static/imghw/default1.png"  data-src="https://img.php.cn/upload/article/000/000/000/174018847567268.jpg"  class="lazy" alt="Quick Tip: The Right Way to Use Figure & Figcaption Elements " />
  <figcaption>Three different breeds of dog.</figcaption>
</figure>

常見(jiàn)問(wèn)題（常見(jiàn)問(wèn)題解答）：>

和

<figure>
  <img src="/static/imghw/default1.png"  data-src="https://img.php.cn/upload/article/000/000/000/174018848099968.jpg"  class="lazy" alt="Quick Tip: The Right Way to Use Figure & Figcaption Elements " />
  <figcaption>
    <h2>Puppy School</h2>
    <p>Championship Class of 2016</p>
  </figcaption>
</figure>

以上是快速提示：使用圖形和圖形元素的正確方法的詳細(xì)內(nèi)容。更多資訊請(qǐng)關(guān)注PHP中文網(wǎng)其他相關(guān)文章！