百里香块失去风格

Posted 2023-02-26

【中文标题】百里香块失去风格

【英文标题】：Thymelaf block loosing style

【发布时间】：2021-05-03 04:08:21

【问题描述】：

我有这段代码：

<div class="col-md-3 col-sm-6 text-center">
<a href="/" class="logo logo_image">
    <span>
        <block >Plats</block>
        <span class="muellerhoff" >Bruts</span>
    </span>
    <img src="http://172.114.143.253:7080/images/logo.png" >
</a>
</div>

我在浏览器上看到了这个：

但是当我使用百里香时：

<div class="col-md-3 col-sm-6 text-center">
    <a href="/" class="logo logo_image">
        <th:block th:text="$@environment.getProperty('site.name1')" />
        <span class="muellerhoff" th:text="$@environment.getProperty('site.name2')"></span>
        <img th:src="@/images/logo.png" th:  th:title="@environment.getProperty('site.name')">
    </a>
</div>

样式丢失了：

当我查看源代码时，我会看到：

<div class="col-md-3 col-sm-6 text-center">
                            <a href="/" class="logo logo_image">
                                Plats
                                <span class="muellerhoff">Bruts</span>
                                <img th:src="@/images/logo.png" th:  th:title="@environment.getProperty('site.name')">
                            </a>
                        </div>

我也试过<block th:text="$@environment.getProperty('site.name1')" />，结果相同

【参考方案1】：

Thymeleaf th:block 与 html 标签 <block> 不同。如果您的第一个 HTML sn-p 按预期工作，则使用 Thymeleaf 对其进行增强应该如下所示...

<div class="col-md-3 col-sm-6 text-center">
<a href="/" class="logo logo_image">
    <span>
        <block th:text="$@environment.getProperty('site.name1')">Plats</block>
        <span class="muellerhoff" th:text="$@environment.getProperty('site.name2')">Bruts</span>
    </span>
    <img src="http://172.114.143.253:7080/images/logo.png" th:src="@/images/logo.png" th:  th:title="@environment.getProperty('site.name')">
</a>
</div>

【讨论】：

我不熟悉 HTML 中的 <block> 标签。它是如何定义的？

嗨@andrewjames，HTML specification 没有<block> 的定义，我可以假设这是作者创建的custom element，可能有一些适用于它的样式.否则，此标签将被视为常规<span>。我创建了基于 HTML 标记的 Thymeleaf 示例，该标记通过问题的定义起作用。我无法运行它，因为它需要一些未发布的 CSS 类。希望以上所有内容都能为您提供科学依据。最好的问候，

是的 - 这是有道理的。谢谢你的笔记。 （我怀疑问题应该是使用<span> 而不是<block> - 但这只是我的猜测。）

@andrewjames 正如我提到的，我不知道，也许作者直接将某些 CSS 样式应用于标签，例如：block border: 1px dashed red; display: block;。我刚刚回答了 Thymeleaf 的问题。