html - JSF 2如何根据浏览器版本设置html样式

标签 html jsf jsf-2 conditional-comments omnifaces

我想在我的 JSF 2 应用程序中做的是根据浏览器版本设置适当的 html 样式,这里是示例代码:

<!--[if lt IE 7]> <html class="lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if IE 7]>    <html class="lt-ie9 lt-ie8" lang="en"> <![endif]-->
<!--[if IE 8]>    <html class="lt-ie9" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <!--<![endif]-->

如何在 JSF 2 中做到这一点?最好/最简单的方法是什么?

我在 Omnifaces (o:conditionalComment) 中发现了一些有趣的东西,但它只允许有条件地加载整个 css,这对我来说毫无用处......

最佳答案

这不是真的 <o:conditionalComment> 用于 CSS 文件。那是一种误解。使用纯 Facelets 标记/组件在技术上根本不可能实现您的要求,因为它会导致格式错误的 XML 语法,从而导致 Facelets 编译错误。

<o:conditionalComment if="lt IE 7">
    <html lang="en" class="lt-ie9 lt-ie8 lt-ie7">
</o:conditionalComment>
<o:conditionalComment if="IE 7">
    <html lang="en" class="lt-ie9 lt-ie8">
</o:conditionalComment>
<o:conditionalComment if="IE 8">
    <html lang="en" class="lt-ie9">
</o:conditionalComment>
<o:conditionalComment if="gt IE 8">
    <h:outputText value="&lt;!--&gt;" escape="false" />
    <html lang="en" class="no-js">
    <h:outputText value="&lt;!--" escape="false" />
</o:conditionalComment>
...
</html>

不是 well formed XML。您知道,XML 结束元素应该​​与 XML 开始元素处于完全相同的范围内。如果每个 <html> 都是有效的 XML有自己的</html>在同一父 XML 元素中。但这又不是有效的 HTML。

只需使用 <h:outputText escape="false">在所有<html>标签。不要忘记为结束做同样的事情 </html>标签。

<o:conditionalComment if="lt IE 7">
    <h:outputText value="&lt;html lang=&quot;en&quot; class=&quot;lt-ie9 lt-ie8 lt-ie7&quot;&gt;" escape="false" />
</o:conditionalComment>
<o:conditionalComment if="IE 7">
    <h:outputText value="&lt;html lang=&quot;en&quot; class=&quot;lt-ie9 lt-ie8&quot;&gt;" escape="false" />
</o:conditionalComment>
<o:conditionalComment if="IE 8">
    <h:outputText value="&lt;html lang=&quot;en&quot; class=&quot;lt-ie9&quot;&gt;" escape="false" />
</o:conditionalComment>
<o:conditionalComment if="gt IE 8">
    <h:outputText value="&lt;!--&gt;&lt;html lang=&quot;en&quot; class=&quot;no-js&quot;&gt;&lt;!--" escape="false" />
</o:conditionalComment>
...
<h:outputText value="&lt;/html&gt;" escape="false" />

很尴尬,但是 HTML5 boilerplate (这种方法的起源地)本身也很尴尬,IMO。

或者,您可以考虑创建自定义 <my:html>组件自己生成所需的标记,这样你就可以满足 <my:html>...</my:html> .

关于html - JSF 2如何根据浏览器版本设置html样式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11721560/

相关文章:

html - 悬停框并更改顶部的三 Angular 形

java - JSF中 "component"的定义是什么

jsf - 两个 primefaces 日历组件验证

java - <h :messages> in JSF 页面上的错误消息

javascript - jQuery - 使用名称属性首次单击时选中和取消选中第二个复选框

带有图像的 HTML 圆 div 试图获取悬停文本

android - JSF 中的 HTTP 请求

jsf-2 - Primefaces 数据表过滤不起作用

html - 为什么我的绝对定位的div不可见?

java - jsf。如何将 backbean 对象从 jsf 表单发布到 javascript