首页 > 解决方案 > Twig - 在子组件中使用 TailwindCSS 的 @apply

问题描述

我正在尝试@apply在子组件中使用 TailwindCSS,但它不应用样式。

{% extends 'base.html.twig' %}
{% block stylesheets %}
{{parent()}}

<style>
h2 {
    @apply text-3xl;
}
</style>
{% endblock %}
{% block body %}
<div class="container mx-auto text-dark-shade">
{% block content %}{% endblock %}
</div>
{% endblock %}

使用标准 CSS 它可以工作并应用样式。

{% extends 'base.html.twig' %}
{% block stylesheets %}
{{parent()}}

<style>
h2 {
    font-size: 3rem;
}
</style>
{% endblock %}
{% block body %}
<div class="container mx-auto text-dark-shade">
{% block content %}{% endblock %}
</div>
{% endblock %}

显示h2在内容块中,它用于重复使用几次的组件。

标签: twigtailwind-css

解决方案


推荐阅读