Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Newline character sequence in CSS 'content' property? [duplicate]

Tags:

css

People also ask

How do I start a new line of content?

The content property accepts a string and: A string cannot directly contain a newline. To include a newline in a string, use an escape representing the line feed character in ISO-10646 (U+000A), such as "\A" or "\00000a". This character represents the generic notion of "newline" in CSS.

Is New Line counted as character?

Newline (frequently called line ending, end of line (EOL), next line (NEL) or line break) is a control character or sequence of control characters in a character encoding specification (e.g., ASCII, EBCDIC) that is used to signify the end of a line of text and the start of a new one.

Which character is used as a new line character?

LF (character : \n, Unicode : U+000A, ASCII : 10, hex : 0x0a): This is simply the '\n' character which we all know from our early programming days. This character is commonly known as the 'Line Feed' or 'Newline Character'.


figcaption:before
{
    content: 'Figure \a' attr(title);
    white-space: pre;
}

Note that in the content attribute value, concatenation is expressed just by whitespace, not by a “+” sign. The escape notation \a in a CSS string literal indicates a linebreak character.


The content property accepts a string and:

A string cannot directly contain a newline. To include a newline in a string, use an escape representing the line feed character in ISO-10646 (U+000A), such as "\A" or "\00000a". This character represents the generic notion of "newline" in CSS.

(No idea about actual browser support.)

You can check Using character escapes in markup and CSS for reference about the escape syntax, which essentially is:

  • \20AC must be followed by a space if the next character is one of a-f, A-F, 0-9
  • \0020AC must be 6 digits long, no space needed (but can be included)

NOTE: use \00000a rather than just \A when escaping an arbitrary string, because if the newline is followed by a number or any character from [a-f] range, this may give an undesired result.