12.4 CSS内联

Thymeleaf也允许在CSS的<style>标签里使用内联，比如：

  1. <style th:inline="css">
  2.   ...
  3. </style>

例如，假设我们有两个变量设置成了两个不同的String值：

  1. classname = 'main elems'
  2. align = 'center'

我们可以像这样使用它们：

  1. <style th:inline="css">
  2.     .[[${classname}]] {
  3.       text-align: [[${align}]];
  4.     }
  5. </style>

结果会是：

  1. <style th:inline="css">
  2.     .main\ elems {
  3.       text-align: center;
  4.     }
  5. </style>

注意CSS内联也有些智能，就像JavaScript一样。特别地，通过类似[[${classname}]] 的转义表达式输出的表达式会被转义为CSS标识符。这也是为什么我们的classname = 'main elems'会变成上面的代码片段里的main\ elems。