Question

我的xhtml中有一个图形图像，我正在加载某些条件：

以下是组件：

<h:graphicImage id="imgHlpProfileClass" 
                        styleClass="helpIcon" 
                        url="/images/icons/dashboard_help_16.png" 
                        alt="Help Text"/>

在这种情况下，会显示alt中的文字。

但是当我在组件中应用渲染条件时，不会显示alt属性。

示例：

<h:graphicImage id="imgHlpProfileClass" 
                        styleClass="helpIcon" 
                        url="/images/icons/dashboard_help_16.png" 
                        alt="Help Text"
                        rendered="#{not empty targetSource.object.type}"/>

修改

我做了这样的改变。呈现的属性正确地适用于输出文本和GraphicalImage。但是在图形图像的情况下，alt不起作用。这有什么不对？

<h:panelGroup id = "overrideProvisioningActionTextPanel">
          <h:outputText value="Override Default Provisioning" 
                        rendered="#{not empty targetSource.object.type}"/>
          <h:graphicImage id="imgHlpAppCase" 
                        styleClass="helpIcon" 
                        url="/images/icons/dashboard_help_16.png" 
                        alt="Help Text"
                        rendered="#{not empty targetSource.object.type}"/>
      </h:panelGroup>

Answer 1

您将alt与title混为一谈。

alt仅在图像中断时显示为替换文本，或者当最终用户使用的客户端不加载像屏幕阅读器这样的图像时。此外，搜索机器人还使用alt作为关键字来匹配图像。 alt 不用作工具提示。因此，应该使用title属性（就像在每个其他组件/元素上一样）。 alt和title的外观也不同。 alt显示为内联文字，而title仅在悬停时显示。

所以，这是你最终需要的：

<h:graphicImage ... title="Help Text" />

这一切都与rendered属性的存在无关。删除它时会遇到完全相同的问题（在拥有工作图像的同时！）。

另见：

Basic HTML tutorial - the <img> element

使用渲染条件时，GraphicImage alt不可见

1 个答案:

另见：