Блог

Я разрабатываю веб-приложение, используя Spring MVC и Thymeleaf в качестве технологии создания шаблонов. Я не могу понять, как настроить правила для изображения, возможно, во внешнем файле CSS.

Я знаю, что работает следующий код:

page.html

 <a class="navbar-brand" href="#">
  <img src="../resources/images/logo.png" class="img-responsive" />           
</a>
  

style.css

 .navbar-brand > img {
    max-height: 100%;
}

h1 { text-align:center; }
  

Но в этом случае, поскольку я использую Thymeleaf, мой html выглядит следующим образом:

thymeleaf.html

 [Boostrap navbar...]
<a class="navbar-brand" href="#">
  <img th:src="@{/resources/images/logo.png}" class="img-responsive" />            
</a>
[...]
[/Bootstrap navbar]

<h1>Test</h1>
  

и, используя тот же CSS, правило не применяется к изображению, вместо этого я вижу правило, установленное на h1 (тест центрирован).

РЕДАКТИРОВАТЬ: правила, установленные для содержимого div в навигационной панели начальной загрузки, не интерпретируются (не отображаются при нажатии на «проверить элемент»). Другие правила, установленные для обычного div (без класса Bootstrap или других), интерпретируются правильно.

ПРАВКА2: импорт CSS

в servlet.xml

 <mvc:resources mapping="/resources/**" location="/resources/"/>
  

в thymeleaf.html

 <link rel="stylesheet" type="text/css" media="all"  
      href="/resources/css/style.css" th:href="@{/resources/css/style.css}" />
  

Как я мог решить? Заранее спасибо.

можете ли вы добавить th:class ie

 <a th:class="navbar-brand" href="#">
  <img th:src="@{/resources/images/logo.png}" th:class="img-responsive" />            
</a>
  

и дайте мне знать, сработало ли это для вас