style.css와 tailwindcss 관련 질문!

혹시 우선 순위를 important 적용해서는 안되나요?

1
property: value !important;

Tailwind CSS는 기본적으로 제공되는 클래스 이름으로 스타일을 적용하며, 사용자 정의 스타일과 충돌이 발생할 수 있습니다. 이 문제를 해결하려면 몇 가지 방법을 사용할 수 있습니다. 1. !important 플래그 사용: Tailwind CSS에서 제공하는 클래스에 대한 우선 순위를 높이려면, 사용자 정의 스타일에 !important 플래그를 사용하여 우선 순위를 낮출 수 있습니다. 2. @apply 지시문 사용: Tailwind CSS의 유틸리티 클래스를 사용자 정의 클래스에 적용하려면, @apply 지시문을 사용할 수 있습니다. 이렇게 하면 우선순위 문제를 해결할 수 있습니다.

1
2
3
4
5
6
7
8
/* style.css */
.custom-class {
  background-color: red !important;
}

/* style.css */
.custom-class {
  @apply bg-red