How can you automatically add CSS classes to <p> tags in the post body?

Question

I'm trying to build a new Drupal site using the Tailwind CSS framework, which relies on inlining CSS classes onto HTML tags.

This is fine in Twig template files where I have direct control of the output and can add the required classes directly, however I'd like to automatically add classes to <p> tags (and probably some other, but <p> is a good start) within the body of certain post types.

Any idea where I should be looking?

I'm not entirely clear on what the correct terminology to search is, and Google returns plenty of results that are at least a decade old and not relevant for Drupal 8.

Answer 1

I have found how to resolve this specifically if using the Tailwind framework, which I am.

You can use the @apply function of the framework to add classes based on common Drupal class names, or ones you specify in your custom html.twig files.

Documentation here: https://tailwindcss.com/docs/functions-and-directives/#apply I am using the Tailwind Starter theme which also uses this function https://www.drupal.org/project/tailwindcss

For example, to apply the text-xl utility class to node paragraph tags, I can use the following code in my stylesheet

.node-content p {
  @apply text-xl
}