Séquence de caractères Newline dans la propriété CSS 'content' ?

Question

Est-il possible d'utiliser nouvelle ligne caractère en CSS content pour forcer un saut de ligne ? Quelque chose comme :

figcaption:before
{
    content: 'Figure \n' + attr(title);
}

Answer 1

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

Notez que dans le content la concaténation est exprimée uniquement par des espaces, et non par le signe "+". La notation d'échappement \a dans un littéral de chaîne CSS indique un caractère de saut de ligne.

Answer 2

El contenu accepte un chaîne de caractères et :

Une chaîne de caractères ne peut pas contenir directement une nouvelle ligne. Pour inclure une nouvelle ligne dans une chaîne, utilisez un échappement représentant le caractère de saut de ligne dans la norme ISO-10646 (U+000A), par exemple " \A " ou " \00000a ". Ce caractère représente la notion générique de "nouvelle ligne" en CSS.

Le plus difficile est de se rappeler que le HTML réduit les espaces blancs par défaut.

figure {
    /* Avoid whitespace collapse to illustrate what works and what doesn't */
    white-space: pre-wrap;
}

#first figcaption:before
{
    /* \n is not a valid entity in this context */
    content: 'Figure \n Chemistry';
    display: block;  
}

#second figcaption:before
{
    content: 'Figure \A Chemistry';
    display: block;  
}

<figure id='first'>
    <figcaption>Experiments</figcaption>
</figure>

<figure id='second'>
    <figcaption>Experiments</figcaption>
</figure>

Vous pouvez vérifier Utilisation des échappatoires de caractères dans le balisage et les CSS pour une référence sur la syntaxe d'échappement, qui est essentiellement :

• \20AC doit être suivi d'un espace si le caractère suivant est l'un des caractères suivants : a-f, A-F, 0-9
• \0020AC doit être composé de 6 chiffres, pas d'espace nécessaire (mais peut être inclus)

NOTE : utilisez \00000a plutôt que juste \A lors de l'échappement d'une chaîne de caractères arbitraire, car si le saut de ligne est suivi d'un nombre ou d'un caractère quelconque de l'ordre de [a-f] cela peut donner une résultat indésirable .