如何在FreeMarker中包括CSS文件

我正在制作带有Spring-Boot＆amp;的网站。春季安全性，更喜欢提供自由标志物作为视图。我不知道 ftl 很多，现在我需要在我的 ftl 中使用Adminlte的CSS和JS文件，但是如何？

<html lang="en">
<#assign basePath=request.contextPath>
<#macro head>
    ...
    <script src="${basePath}WEB-INF/AdminLTE/dist/js/adminlte.min.js"></script>
    <link src="${basePath}WEB-INF/AdminLTE/plugins/iCheck/line/line.css" rel="stylesheet"></link>
    <script src="${basePath}WEB-INF/AdminLTE/plugins/iCheck/icheck.js"></script>
    ...
<#macro>

您可以使用<#include >标签包含CSS文件将样式表放入目录中，并使用 <#include "/{path to style sheet}/Styles.css">

并确保您的样式表在样式元素中：

<style type="text/css">
...
</style>

这种方法的示例是

测试模板

<html>
<head>
<#include "css/test.css">
</head>
<body>
.......................
</body>
</html>

test.css

<style type="text/css">
body{background-color:#C5C5C0;}
*{font-family:Tahoma, Verdana, Helvetica, sans-serif;}
</style>

您可以在代码中声明一些参数，并使用它填充到CSS

的完整路径

// in java
params.put("htmlIncludePath", "classpath:/templates/pdfTemplates/include/");
...
// in ftl
<link href="${htmlIncludePath}manrope.css" rel="stylesheet">

物理文件应位于src/main/resources/resources/pdftemplates/include

中

我使用了这个简单的解决方案。

我为CSS-S。

创建了专用的GET方法

@GetMapping(value="/css/{cssFile}") 
    public @ResponseBody byte[] getFile(@PathVariable("cssFile") String cssFile) throws IOException {
    
            InputStream in = getClass()
                    .getResourceAsStream("/css/" + cssFile);
            try {
                return in.readAllBytes();
    
            } catch (Exception e){
                var error = new String("ERROR: css file (/css/" + cssFile + ") not found");
                return error.getBytes();
            }
        }

现在，我可以在.ftlh文件中以通常的HTML方式引用CSS文件。只需要将我的文件放在资源/CSS/Directory中。

<html>
<head>
<link href="css/general.css" rel="stylesheet">
</head>
<body>
...

另外，请注意，建议的方法（请参阅其他响应），其中包括语句，将产生一个带有相应CSS文件的完整内容的HTML文件，而不是指向CSS的链接。因此，如果您的CSS文件很重，则希望其内容实际上将包含在客户端收到的HTML文件中。

相关内容

最新更新

热门标签：