Tailwind Crash Course - Project Based Learning
Combination Modifiers
Combination modifiers are nothing more than an another layer of modification. Let go back to the same example SMILEY HERE
.bg-blue-500
If we need to add a hover stat on a breakpoint, here is the method:
.{breakpoint}:{modifier}:{class-name}
.md:hover:bg-blue-500
So this will add hover stat but only on medium breakpoint.
Classes | |
.md:hover:bg-{color}-{shade} .md:focus:bg-{color}-{shade} .md:hover:text-{color}-{shade} .md:focus:text-{color}-{shade} |
med+ hover background color med+ focus background color med+ hover text color med+ focus text color |
Here we are wrapping modifiers and moving to the next lesson.