5568 sujets

Sémantique web et HTML

Bonjour à tous,
Je suis confronté à un petit souci avec le soulignement d'un caractère.
Voilà le code :
<a href="#" title="65 - LETSON, ET &Ccedil;A SONNE ! - Jonathan ou Jonathan">lien</a>
Je souhaite que le 'n' final du second 'Jonathan' soit souligné ?
Bonjour,
Il va falloir encadrer le "n" avec un span, soit côté serveur, soit côté client.
D'autres solutions existent mais elles sont terriblement hacky.
Bonjour,
Merci pour votre réponse.
Par contre, je ne peux pas mettre un <span> dans mon 'title', cela est interprété comme du texte et non comme un <span>
<a href="#" title="65 - LETSON, ET &Ccedil;A SONNE ! - Jonathan ou Jonatha<span style="text-decoration: underline;">n</span>">lien</a>
Ce code n'est pas fonctionnel ????
Il est bon. Mais peut-être avez-vous fait cela à partir d'un formulaire qui enregistre ensuite en base de donnée ?
Dans ce cas le code doit être neutralisé par protection, ceci afin d'éviter une injection html. Ceci est accomplit par le serveur, par exemple avec htmlentities(), htmlspecialchars(), strip_tags(), etc pour un serveur en PHP.

EDIT : pardon, j'ai fait fausse route. C'est Parsimonhi qui a raison.
Modifié par Olivier C (25 Jan 2022 - 10:20)
Modérateur
Bonjour,

Le mot "Jonathan" à modifier étant dans une chaine de caractères elle-même valeur de l'attribut title, il ne peut pas être stylé (et pour son "n" final, c'est pareil).

On peut éventuellement bricoler et placer le contenu de l'attribut title dans autre chose lorsque l'utilisateur vient survoler l'élément concerné. Utiliser du javascript est-il une possibilité dans ton cas ?

Sinon, il faudrait peut-être considérer placer cette chaine dans un véritable élément html qui s'afficherait au survol du <a>.

Amicalement,
Modifié par parsimonhi (24 Jan 2022 - 21:11)
Ah ! que je suis bête : j'ai lu trop vite le premier post et suis resté sur mon interprétation de départ...

Effectivement, l'attribut title ne peut pas être stylé, sauf si on le remplace en javascript par du html. Mais le jeu en vaut-il la chandelle ?
Merci pour vos réponses.
Les choses se corsent, le 'title' se trouve dans une 'map' d'une image. Voilà le code :
<area shape="poly" coords="121,322,134,306,147,312,186,280,242,288,273,294,314,310,336,312,335,345,334,368,321,379,325,420,209,416,208,392,156,370,122,343" href="https://lockee.fr/o/V2yoIGef" target="_blank" title="65 - UN SON, ET &Ccedil;A SONNE ! - Jonathan ou Jonathan&#863;">
J'ai trouvé une astuce, j'applique le caractère '&#863' qui souligne le 'n', mais il déborde sur la droite (damned).
J'ai tenté une solution avec un tooltip en CSS, mais je pense que c'est beaucoup d'énergie pour pas grand chose. Enfin...
Modérateur
Bonjour,

_laurent a écrit :
... on peut utiliser le symbole Unicode : https://www.compart.com/fr/unicode/U+1E49 ?

Très astucieux, ce n souligné. Smiley cligne

luxojr a écrit :
J'ai trouvé une astuce, j'applique le caractère '&#863' qui souligne le 'n', mais il déborde sur la droite (damned).

Jonathan&#x332; semble mieux fonctionner.

Amicalement,