Css attribute selector where attribute name containing : in it

Question

I'm trying to target an elements attribute that contains a colon: :

.someclass[xml:lang="da"]

HTML:

<span class="someclass" xml:lang="da">

Is this possible, does not work with above syntax?

Answer 1

CSS has special characters that cannot be applied in class names, so to use them, CSS escapes with a backslash (\)

here is the list of the special characters:

!, ", #, $, %, &, ', (, ), *, +, ,, -, ., /, :, ;, <, =, >, ?, @, [, \, ], ^, `, {, |, }, and ~

.someclass[xml\:lang="da"] {
  background: red
}

<span class="someclass" xml:lang="da"> text</span>