figure 元素内嵌套 pre 元素时 figcaption 如何提供可访问名称
figure 元素内的第一个 figcaption 元素会被浏览器识别为该 figure 的可访问名称。
figcaption 元素作为 figure 可访问名称的生效规则
figure 元素本身没有默认的可访问名称，当其内部包含 figcaption 元素时，该元素会自动成为父级 figure 的可访问名称。浏览器和辅助技术会将 figcaption 的内容识别为 figure 的标签，从而帮助屏幕阅读器用户理解图片或图表的上下文。这种机制确保了即使图片没有 alt 文本，只要存在 figcaption，用户也能获取到相关的描述信息。
figcaption 元素必须作为 figure 的直接子元素才能生效。如果 figcaption 被嵌套在其他标签内部，或者 figure 内部没有 figcaption，figure 将无法获得自动生成的可访问名称。这种设计要求开发者将描述性文本直接放置在 figure 标签内，以保证语义的完整性和可访问性的一致性。
figcaption 元素在 figure 中的位置与内容要求
figcaption 元素在 figure 内部的位置可以是第一个子元素，也可以是最后一个子元素，甚至可以位于其他流内容之间。无论位置如何，只要它是 figure 的子元素，浏览器就会将其内容视为 figure 的可访问名称。这种灵活性允许开发者在图片、代码块或引用内容前后添加说明文字，而不影响可访问性的实现。
figcaption 元素的内容必须是流内容，这意味着它可以包含文本、图片、链接等元素。例如，在引用诗歌的示例中，figcaption 包含了作者和作品名称，这同样会被识别为 figure 的可访问名称。这种特性使得开发者能够利用 figcaption 提供丰富的上下文信息，而不仅仅是简单的图片说明。
figure 元素的可访问性验证方法
要验证 figure 元素的可访问名称是否正确生成，可以使用浏览器的开发者工具检查元素的 ARIA 属性。在无障碍树中，figure 元素应该显示其 aria-label 或 aria-labelledby 属性，其值对应于 figcaption 的文本内容。如果辅助技术能够正确朗读出 figcaption 的内容，说明可访问名称已正确提供。
另一种验证方法是使用屏幕阅读器浏览页面。将光标移动到 figure 元素上，屏幕阅读器应该朗读出 figcaption 的内容，而不是仅仅朗读图片的 alt 文本。如果朗读结果与 figcaption 内容一致，则说明该 figure 元素的可访问性设置正确，能够为用户提供清晰的上下文信息。
figure 元素与 figcaption 的语义关联
figure 元素代表自包含的内容，可能包含可选的标题，而 figcaption 元素专门用于提供这种可选的标题。两者在语义上紧密关联，figure 描述内容的类型，figcaption 描述内容的名称或说明。这种关联确保了内容的结构化和可理解性，使得搜索引擎和辅助技术能够正确解析页面的内容层次。
当 figure 元素包含多个子元素时，figcaption 依然作为整个 figure 的可访问名称。例如，在包含代码块的 figure 中，figcaption 描述了代码的功能，而代码块本身是 figure 的内容。这种设计使得开发者能够将代码、图片或引用等内容组织在一起，并通过 figcaption 提供统一的上下文说明，从而提升页面的整体可访问性。
资料与延伸阅读
你可以通过以下原始资料核对文中概念，并继续深入阅读。