Fatal编程技术网
  • css/
  • JSF的外部CSS

JSF的外部CSS

css jsf

JSF的外部CSS,css,jsf,external,Css,Jsf,External,向jsf添加外部CSS文件的语法是什么 两种方法都试过了，没用 一, @导入url（“/styles/decoration.css”）； 二, 我从未使用过第一个，但第二个在语法上是有效的，从技术上讲应该可以使用。如果它不起作用，那么href属性中的相对URL就是错误的 在相对URL中，前导斜杠/指向域根。因此，如果JSF页面是由http://example.com/context/page.jsf，CSS URL将绝对指向http://example.com/styles/decorati

向jsf添加外部CSS文件的语法是什么

两种方法都试过了，没用

一,


@导入url（“/styles/decoration.css”）；
二,

我从未使用过第一个，但第二个在语法上是有效的，从技术上讲应该可以使用。如果它不起作用，那么
href
属性中的相对URL就是错误的

在相对URL中，前导斜杠
/
指向域根。因此，如果JSF页面是由
http://example.com/context/page.jsf
，CSS URL将绝对指向
http://example.com/styles/decoration.css
。要知道有效的相对URL，您需要知道JSF页面和CSS文件的绝对URL，并从另一个中提取一个

假设您的CSS文件实际位于
http://example.com/context/styles/decoration.css
，则需要删除前导斜杠，使其相对于当前的上下文（即
page.jsp
中的上下文）：

我想巴卢斯克可能有你的答案

不过，我想补充几点：

假设您正在web应用程序的子目录中运行。 根据我的经验，您可能希望尝试以下方法： 

“${facesContext.externalContext.requestContextPath}/”
链接将帮助您立即返回到上下文的根目录

编辑：从
'href=”中删除开始的
/
/${facesContext.ex..
。如果应用程序在根上下文中运行，CSS url以
/
开头，浏览器无法找到CSS，因为它被解释为
http://css/style.css

我认为塞尔吉奥尼的问题是双重的

首先，正如BalusC所说，所谓的根相对实际上是域相对的，因此，在示例中是相对于
http://example.com/
而不是
http://example.com/context/

所以你必须具体说明

<link rel="stylesheet" type="text/css" href="${request.contextPath}/styles/decoration.css" />
顺便说一句，巴卢斯克，恭喜你，这是我第一次看到正确的解释！我费了很大劲才发现这一点

但是，如果您想简化并提出以下建议：

<link rel="stylesheet" type="text/css" href="styles/decoration.css" />
假设样式目录是当前页面的同级目录，则可能存在第二个问题：

然后你进入了相对URL方法，我知道你是通过转发而不是重定向进入这个页面的，你的浏览器可能被愚弄了，无法遵循相对路径

要解决第二个问题，必须添加以下内容：

<head>
    <base href="http://${request.serverName}:${request.serverPort}${request.contextPath}${request.servletPath}" />
基本元素必须位于任何链接之前

通过base命令，您可以告诉浏览器您的实际位置

希望能有帮助

顺便说一句，在这个奇妙的jsf世界里，还有一件奇怪的事情：

要从页面链接到其facelet模板，根相对链接这次包括上下文，因此：

<ui:composition template="/layouts/layout.xhtml">
这确实链接到
http://example.com/context/layouts/layout.xhtml

而不是
http://example.com/layouts/layout.xhtml
类似于
或

Jean-Marie Galliot

尝试下面的代码在jsf页面中导入css。它肯定会工作

<style media="screen" type="text/css">

  @import "#{facesContext.externalContext.request.contextPath}/css/Ebreez.css"

</style>


@导入“#{facesContext.externalContext.request.contextPath}/css/Ebreez.css”
更新后的JSF 2.0方法更加整洁。而不是：

<link rel="stylesheet" type="text/css" href="#{request.contextPath}/css/compass.css"/>
您现在可以执行以下操作：

<h:outputStylesheet library="css" name="compass.css"/>
样式表资源应该放在
resources\css.
中，其中的资源与WEB-INF处于同一级别。

奇怪的是，这没有帮助，我们将尝试下面提出的方法，并很快写下结果告诉JSF页面和css文件的绝对URL，然后我们可以帮助进行数学计算。JSF:c:\sample\src\main\webapp\store.xhtml css:c:\sample\src\main\webapp\styles\decoration.cssI没有要求绝对的文件系统路径。我要求的是绝对的URL。你在浏览器地址栏中看到的那个。只要
就足够了。至于“bizzare thing”“，这是Facelets的记录行为。它们始终与上下文根相关，而不是与域根相关。什么是上下文根，什么是域根？同时请记住所解释的库属性的正确使用。” 
<style media="screen" type="text/css">

  @import "#{facesContext.externalContext.request.contextPath}/css/Ebreez.css"

</style>

<link rel="stylesheet" type="text/css" href="#{request.contextPath}/css/compass.css"/>

<h:outputStylesheet library="css" name="compass.css"/>