div classes without curly brackets and dot?

[mariashinoto]

I am using div with class "note" or "tabset" in a revealjs project. Both work with and without curly brackets and dot. Like so:

::: note

:::

::: {.note}

:::

Both are OK. Of course, the first solution looks cleaner, and it is identical to Pandoc suggestions. So I would prefer using this syntax; but the Quarto documentation shows the second syntax.

1. Which is recommended for Quarto?
2. And does your suggestion to other div classes in Quarto as well?

Thanks!

[cscheid]

The syntaxes are equivalent, and the first is simply a shorthand for Pandoc's Attr annotations when indicating only classes. Attr annotations include classes, identifiers, and attributes. We often use the second one ourselves because it is more general: if you want to include classes as well as attributes, then you need to use the curly-bracket-and-dot notation for the classes.

[mariashinoto]

Thanks a lot.

So I will use Pandoc's Attr annotation and learn a bit more about the difference between classes and attributes.

[cscheid]

No problem. I tried to search pandoc.org for a discussion of these syntax differences, and the best one I found is in a section about an extension to add attributes to code blocks. Still, you can see the pattern and how it relates to DOM properties like classes, identifiers and attributes.

[mariashinoto]

Now I got it: It is about attributes and classes in CSS, I did not get this point. Without your help, I would not have understood this so easily; thank you for pointing me to this link!