Bout de code soulignement, liste ou encadré (boostrap5 ou css simple?

Bonjour
je cherche des css qui permettent d'améliorer le rendu d'éléments comme
1/ soulignement d'un titre, mais qui fasse toute la longueur (pas uniquement le texte et si possible avec un effet dynamique de gauche à droite) quand le titre apparait ??)
2 /liste d'éléments ul/li avec une petite icône (mais pas une image) devant
3/ un encadré d'un bout de texte du genre note (mais pas de blockquote)
...

J'ai cherché des bouts de code sur des sites comme https://codemyui.com , https://codepen.io/ mais je n'ai rien trouvé (même s'il y a beaucoup de possibilités), peut-être mon anglais défectueux !?
@+
Modifié par HDcms (04 Jan 2022 - 10:02)

Bonjour
Je ne sais pas si cela peut être une piste intéressante, mais le cms joomla 4 intègre boostrap 5 ! (à la remarque près que j'ai l'impression ou vu que tout n'est pas chargé, je ne sais donc pas si je peux avoir accès à des éléments qui me permettrait de faire la mise en page souhaitée??)

Bonjour
Je n'ai pas trouvé de solutions.
Si quelqu'un peut me répondre
s'il faut mieux chercher du côté css vs boostrap 5/joomla ?
ou mieux sur la recherche de tips pour ces petits besoins ?

Salut,


Je ne pense pas que ca nécessite du Bootstrap effectivement.

HDcms a écrit :
1/ soulignement d'un titre, mais qui fasse toute la longueur (pas uniquement le texte et si possible avec un effet dynamique de gauche à droite) quand le titre apparait ??)

un border-bottom au titre et un display block pourqu'il prenne toute la largeur ?
Pour l'animation il faudrait plutôt par un ::before ou ::after et animer la largeur en absolute dans le bloc du titre.

HDcms a écrit :
2 /liste d'éléments ul/li avec une petite icône (mais pas une image) devant

Enlever les puce par défaut et rajouter une icone en before de chaque li

HDcms a écrit :
3/ un encadré d'un bout de texte du genre note (mais pas de blockquote)

pas très très bien compris mais un span avec un border autour du bout de texte peut faire l'affaire ?

Sans exemple, image ou même code c'est un peu dur de te guider...

Bonjour Laurent
Ok je vais plutôt partir sur du css, de toute façon il fallait a priori ajouter qq chose dans Joomla.
Néanmoins, je ne suis pas assez bon en CSS, c'est pour cela que je cherchai des bouts de code existants et inspirants sur des sites !? J'ai dans mes favoris les sites mentionnés, mais ce n'est pas facile à chercher dedans ou alors pour des effets beaucoup plus ambitieux.

Si tu fais un site internet je pense sincèrement que ces petites choses sont a ta portée et au pire, on est là et tu apprendra des trucs pour ne plus en avoir peur

en avant mousaillon : https://jsfiddle.net/ tape tes premières lignes de code en commençant par le html (juste les bout que tu veux styler, comme le titre)

Bonjour
Merci de m'encourager. J'ai un peu avancé même si je n'avais pas bien utilisé au début https://jsfiddle.net/ et j'espérais l'autocomplémentation car je n'ai pas ces connaissances de codes css !!
J'ai scindé mes demandes en plusieurs fils
https://forum.alsacreations.com/topic-4-89134-1.html titre
https://forum.alsacreations.com/topic-4-89135-1.html li
https://forum.alsacreations.com/topic-4-89136-1.html encadré
Modifié par _laurent (10 Jan 2022 - 15:34)