Comment copier une balise avec l'ensemble des classes qui y sont rattachés?

Signaler
Messages postés
3
Date d'inscription
mercredi 17 septembre 2014
Statut
Membre
Dernière intervention
29 avril 2021
-
 GravySauce -
Bonjour,

Je suis développeur dans un cabinet. Je dois développer une interface et je voudrais savoir comment faire pour copier par exemple une balise <div></div> avec l'ensemble des classes auxquelles elle fait appel sans avoir à copier des fichiers et classes CSS que je n'aurais pas à utiliser.
Il y a-t-il un logiciel pour cela?


Merci d'avance.

Configuration: Windows / Chrome 90.0.4430.93

1 réponse

Salut,
euh c'est simplement impossible et illogique ce que vous dites.

La classe (class) indiquée dans l'attribut d'une balise doit correspondre à des propriétés (feuilles de styles en cascade)indiquées quelque part.

Donc si vous avez une classe qui ne se rapporte à rien elle n'aura juste aucun effet.

" copier des fichiers et classes CSS"
Pas copier mais indiquer le fichier où elle se trouve, de la même manière que pour un fichier de script(programmation) cela permet de réutiliser et interchanger les propriétés que l'on veut utiliser, donc rendre la mise en page(les styles CSS comme ils sont décrits pour les classes, id et autres sélecteurs CSS).

Après vous pouvez vous passer par exemple en créant les propriétés de style en interne dans la page(soit dans la balise avec l'attribut "style", soit en les indiquant avec la balise style ) dans de ce principe mais ça aura plusieurs impact négatifs:
complexité et verbiosité du code qui vont donc rajouter du texte plutôt que de le "sérialiser" ou le rendre "générique" c'est à dire pouvant être détaché d'une page en particulier et servir ailleurs.
Comme il y aurait plus de textes et de caractères dans la page celle ci (le fichier) sera plus longue à charger.
Cela peut être et sera dans la plupart des cas pas vraiment impactant mais si un fichier de 52ko passe à 210ko c'est juste 4 fois plus de données à charger donc 4 fois plus long. Et multipliez ça par votre nombre de pages en tenant compte des connexions les moins rapides(lieu de bas débit et appareils mobiles moins performant) vous aurez juste des pages plus longues à s'afficher pour la majorité des utilisateurs(ceci étant sur téléphone mobile) sauf que non vu que on reste sur des fichiers assez légers et le temps de chargement reste de l'ordre de millièmes ou centaines de secondes...
Donc il faut vraiment une différence de poids de fichiers importantes (en Mo contre un fichier en ko) et une connexion d'un autre âge pour que cela ait une importance.

" des fichiers et classes CSS que je n'aurais pas à utiliser. "
Dans ce cas vous les supprimez si elles sont inutiles ou vous fragmentez le fichier en plusieurs pour pouvoir les charger quand vous en aurez besoin. Bien sûr tout dépends de la taille des fichiers.
Si vous utilisez 2 classes CSS il est inutile de faire appel à des outils comme Bootstrap qui va impliquer tout un ensemble de classes CSS crées en partie avec JavaScript et donc éviter de charger un éléphant (et donc rajouter le temps de chargement de celui ci) pour accoucher d'une souris.
Mais si vous utilisez correctement un tel outil(framework CSS) vous avez tout un tas de possibilités que vous pouvez utiliser dans le site et donc gagner en temps de développement et complexité d'ajout que vous devez faire vous même pour le site comme il est maintenant et quand il est nécessaire de le faire évoluer, de modifier ou d'ajouter une mise en page et d'autres fonctionnalités.
Parce que dans une page il y a bien sûr beaucoup plus d'un jeu de règles de styles à utiliser dans la page que 2 et que la mimification et la présence possible de CDN permet d'alléger le poids au chargement.

Donc soit vous internaliser et rendez vos pages complexes et difficiles à mettre à jour et modifier quand vous en avez le besoin tout en rendant le poids de la page plus volumineux soit vous faites correctement et garder les classes externes.

Connaissez vous vraiment le principe de CSS parce que votre question est curieuse, à moins que vous vouliez inventer l'eau chaude et une nouvelle façon de faire alors qu'une fonctionne très bien depuis une vingtaine d'années(avant CSS ce n'était pas jojo il fallait utiliser JavaScript avec une complexité + temps de travail accrus pour des résultats moins bien).

Bref faites correctement et regardez si ça pose problème.
Vous ne copiez pas une classe mais l'indiquez dans une balise HTML donc ce n'est pas

<!-- n'indique aucune classe CSS: -->
<div></div>

<!-- avec une classe CSS indiquée en amont pour une ou plusieurs propriétés CSS-->
<div class=nom-de-classe></div>
<!-- avec plusieurs classes CSS indiquées pour un élément, autant qu'on veut il suffit d'avoir un espace entre le nom et bien sûr qu'elles correspondent au résultats voulus essentiellement une mise en page-->
<div class=nom-de-classe autre-nom-de-classe></div>


Pour ce que vous dites simplement créer un nouveau fichier externe et n'utilisez que celui ci , ou simplement recopiez les classes utilisées dans un fichier à part et en supprimant le chargement de l'ancien.
Comme vous dites n'en utilisez que peu ça devrait être assez rapide.

Mais bon est que ça vaut le coup et quel est le but si un fichier CSS existe déjà et est externalisé pour pouvoir servir de socle à une page il me semble que ça à pas mal d'avantages aussi, l'un d'eux se simplifier la vie au lieu de la compliquer et ne pas perdre du temps sur des détails qui ont aucun impact (ou très très peu)sur la qualité du site.