2014-09-23 11 views
5

Sto facendo un progetto con la molla MVC e Thymeleaf. Ho una domanda su come avrei dovuto riferire i miei file CSS se ho questa struttura di cartelle:riferimento a un file .css con thymeleaf in mvc primavera

src 
    main 
    webapp 
    resources 
     myCssFolder 
     myCssFile.css 
    web-inf 
     spring 
     views 
     myViewFolder 
      index.html 

La mia classe di configurazione è simile a questo:

@Override 
    public void addResourceHandlers(ResourceHandlerRegistry registry) { 
     registry.addResourceHandler("/css/**").addResourceLocations("/css/**"); 
     registry.addResourceHandler("/img/**").addResourceLocations("/img/**"); 
     registry.addResourceHandler("/js/**").addResourceLocations("/js/**"); 
     registry.addResourceHandler("/sound/**").addResourceLocations("/sound/**"); 
     registry.addResourceHandler("/fonts/**").addResourceLocations("/fonts/**"); 
    } 

E chiamo href nel mio file di indice come questo :

href="resources/css/bootstrap.min.css" 

Ma ci sono alcuni elementi che sono tipo di incasinato nella mia pagina, ad esempio, la CSS non funziona.

+0

sarebbe bene se hai mostrato la la struttura del progetto e la richiesta HTTP effettiva che viene effettuata sul server per la risorsa – geoand

+0

Hai trovato la soluzione? –

risposta

7

È necessario utilizzare l'attributo th:href per i file di riferimento css. Ecco un esempio del tutorial di Thymeleaf. Se thymeleaf non può valutare il valore th:href, il valore predefinito è href.

<head> 
    <title>Good Thymes Virtual Grocery</title> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
    <link rel="stylesheet" type="text/css" media="all" 
     href="../../css/gtvg.css" th:href="@{/css/gtvg.css}" /> 
</head> 
+0

non ha funzionato, le mie risorse sono ok? – stackUser2000

+0

no, ciò che @Narresh ti ha mostrato era un esempio di come usare th: href – ndrone

+1

La tua configurazione sembra essere corretta. tuttavia, dovresti avere i tuoi file css nella cartella 'webapp/css /' e dovresti fare riferimento ad esso usando 'th: href =" @ {/ css/bootstrap.min.css} "' –

2

Ho un tale problema! I passaggi mi hanno aiutato.

  1. Ho la directory /resources/css/myCSS.css. Così avevo messo css in radice come /css/myCSS.css e rimosse directory/risorse
  2. I collegamenti MyCSS come questo:

<link th:href="@{/css/MyCSS.css}" href="/css/MyCSS.css" rel="stylesheet" type="text/css" />

Problemi correlati