Are there any reserved keywords for attribute values in HTML?

Question

I mean, are there any words that we shouldn't use as the <tag class='reserved' />, class, id or any other thing?

I was planning to style the links with class "link", is this a good idea?

Simulcast

Answer 1

There are no reserved keywords for the class attribute, with the caveat that using special characters other than letters, numbers, or the underscore in the name, or beginning the name with a number, makes using it as a CSS selector more difficult.

Check out the HTML spec:

The attribute, if specified, must have a value that is a set of space-separated tokens representing the various classes that the element belongs to.
...
There are no additional restrictions on the tokens authors can use in the class attribute, but authors are encouraged to use values that describe the nature of the content, rather than values that describe the desired presentation of the content.

... where a set of space-separated tokens is exactly what you'd think and has no other restrictions.

When the class is used as a CSS selector...

... the CSS grammar comes into play. A CSS name can contain:

• alphanumeric characters [a-zA-Z0-9]
• the underscore _
• the hyphen -
• select non-ASCII/extended ASCII characters (octal \240-\377 — includes common symbols, letters with diacritics, etc.)
• or a character escaped by \. Escaped characters can be a Unicode code point (up to six bytes, terminated by whitespace, such as a regular space " ", if needed) or a non-alphanumeric character.

In addition, the name can't start with a (literal) number or hyphen, so those must be escaped. Because the escaped character must not be alphanumeric (specifically 0-9 or a-f, to differentiate from Unicode points, I assume), the Unicode value must be used if the selector name begins with a number.

Example (noting that \32 is the Unicode value for 2):

...
<style>
  .\32 34 { color: red; }
  .big-\$-G { color: green; } /* the color of money */
</style>
...
<div class="234">Some text here.</div>
<div class="big-$-G">This is in the "big-$-G" class.</div>
...

---

In my opinion, using "link" as a class name for links is fine, as long as it applies to all links you'll be defining. Otherwise, use something like "importantLinks", "mainLinks", etc.

Bethelbethena

Answer 2

I believe it is ok to use word link for class naming. However, try to give it more explicit name so it not conflict with other code in the future.

Just go in source of such framework as bootstrap and see how they name their classes.

Use namespasing

Limpid

Answer 3

In the case of JavaScript and ‍‍‍JSX (JavaScript XML), there are some HTML attributes which only reserved for JavaScript, not for JSX. Such as class and for.

Interleave