Question

我尝试在JSP文件的头部包含样式表的链接，并尝试在项目样式表中使用@import选项。没有任何效果。我也没能找到一个webjar或任何这样的东西。

CSS：

@import url('https://fonts.googleapis.com/css?family=Boogaloo');

body {
    font-family: 'Boogaloo', cursive;
}

JSPF：

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link href="<c:url value="/resources/css/main.css" />" rel="stylesheet">
    <link href="webjars/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Boogaloo" rel="stylesheet">

    <title>HappyLibs Emailer</title>
</head>

Answer 1

关于使用Google字体，Spring MVC或JSP没有什么特别之处。

根据我的经验，外部文件（如css，javascript和images）通常位于WebContent文件夹（标准版本）或webapp文件夹（maven版本）中。

我不相信c：url标签是必要的。

标准示例： [root] / WebContent / [无论文件夹结构有意义] /main.css

MVN示例： src / main / webapp / [无论文件夹结构有意义] /main.css

我碰巧喜欢这样的结构 - ＆gt; / view / page / [特定页面] / [文件]

然后，在JSP中：

<!DOCTYPE html >
<html>
     <head>
          ...
          <link href="https://fonts.googleapis.com/css?family=Boogaloo" rel="stylesheet">
          <link href="view/main.css" rel="stylesheet" >
          ...
     </head>
     <body>
          ...
     </body>
</html>

此外，如果浏览器的开发者工具无法在指定位置找到文件，则应显示错误。

Chrome开发者工具（即：右键点击页面并选择＆＃39;检查＆＃39;）：如果控制台选项卡无法找到，则会显示错误。 “源”选项卡将显示页面实际加载的文件。 “元素”选项卡将指定应用于相关元素的样式 - ＆gt;确保别的东西不会简单地覆盖你期待的风格。

Answer 2

发现问题 - 它实际上是由我头脑中的链接顺序引起的。我需要在Bootstrap链接之后应用我的CSS，这样我的样式就不会被覆盖：

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link href="webjars/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Boogaloo" rel="stylesheet">
    <link href="<c:url value="/resources/css/main.css" />" rel="stylesheet" type="text/css">

    <title>HappyLibs Emailer</title>
</head>

是否可以在Spring MVC JSP文件中使用Google Fonts？

2 个答案: