S'abonner à mon canal :
Ressources utilisées :
Aide sur la référence du sélecteur CSS
Transcription vidéo
Salut les gars comment allez vous?
Dans cette vidéo, nous allons voir comment modifier le style, le design de n'importe quel formulaire ou tout autre élément de notre page Web si nous n'avons pas d'identifiant et de classe.
Nous allons voir comment le faire par css s'il nous manque ces éléments, la classe ou l'identifiant.
C'est quelque chose qu'un étudiant m'a demandé et nous allons voir comment cela pourrait être fait, cela me semble très intéressant et c'est pourquoi je voulais vous montrer que cela se fait de manière très simple, aussi pour le faire nous allons utiliser l'aide et dans ce cas nous allons voir qu'en dehors des identifiants et des classes nous pouvons faire des appels via les attributs.
Donc grâce à ça on peut le faire, n'ayez pas peur de tout ce que vous voyez ici car on va le faire de manière très simple, dans ce cas je vais modifier cette balise, dans la balise name mais je ne Je ne veux pas que la balise e-mail soit modifiée, donc si je clique avec le bouton droit, inspecte, je peux voir le code source en chrome.
Dans ce cas, si vous vous rendez compte que ce label a bien une classe mais que je ne vais pas l'utiliser, imaginez qu'il n'avait pas cette classe, c'est très simple, en fait, si je l'ai sélectionné et là je clique dessus plus va générer une règle déjà avec la classe écrite mais dans ce cas je vais supprimer la classe car je vais imaginer qu'elle n'existait pas, donc grâce à l'attribut, dans ce cas, FOR qui est l'attribut que nous avons ici.
Si nous réalisons que l'attribut a la valeur de input_2_8, si je sélectionne, par exemple, la balise email, nous voyons qu'il s'agit de input_2_2, c'est-à-dire que chacune de ces balises a une valeur différente, donc je peux en modifier une et non la le repos.
Comme je l'ai dit, je vais sélectionner dans la balise de nom et nous allons créer une règle, je ne vais pas utiliser cette classe et ce que je vais faire ici est ce qui suit J'ouvre les crochets Je ferme les crochets et ici dans le milieu j'ajoute que lorsque l'attribut for est le même j'ouvre et ferme les guillemets bien que si je ne le faisais pas cela fonctionnerait aussi et je mets qu'il est égal à input_2_8 , je vais lui dire que je veux que la couleur soit égal au rouge, c'est-à-dire rouge.
Donc, notez que seule cette étiquette a été modifiée, le reste reste le même.
J'ai pu utiliser l'étiquette ici mais en utilisant les attributs, nous avons pu modifier cela et c'est aussi très intéressant car si nous le découvrons ici dans l'aide, quelque chose peut être fait qui peut être encore plus utile.
Je peux imaginer que je souhaite uniquement que la couleur soit modifiée ou mettre une icône par exemple lorsqu'il s'agit d'un lien vers un pdf ou lorsqu'il a une url spécifique par exemple comme vous pouvez le voir ici afin que nous puissions le faire pour changer l'un des les attributs dans ce cas je vais utiliser cette règle et vous allez voir comment cela fonctionne.
Si je viens ici sur ma page ici on voit que j'ai un lien, dans ce cas j'ai le lien qui est ici et comme vous pouvez le voir je n'ai pas de classe, pas d'identifiant, de ce lien comment pourrais-je le modifier, ben remarquez si je clique comme ça Dans ce cas, si je fais seulement une règle pour tous les liens, tous seraient modifiés, mais je ne veux pas qu'ils soient tous modifiés, je veux seulement les liens qui ont, par exemple , dans le lien écrit comme faisant une page.
Par exemple, ce que je peux faire ici, c'est ouvrir des crochets et les fermer. J'aime les fermer au début pour ne pas oublier, et je demande que lorsque l'attribut href est présent, je vais mettre un astérisque dessus, comme on l'a vu dans l'aide, pour tout ce qui est ici au milieu et je vais vous dire ça, j'écris crochet ouvert et fermé je mets astérisque href pareil j'ouvre et ferme les guillemets et me voilà je vais dire par exemple qu'on pourrait écrire comment faire une page et là je vais dire que je veux que la couleur soit aussi rouge, par exemple, et vous voyez que ça a changé.
De plus, si je vous dis ici de changer les liens quand le lien est comment faire une page je mets autre chose ici, vous verrez que ça ne change pas car autre chose n'y est pas écrit à la place si je mets ici pour exemple simplement Comment faire une page c'est ça pour fonctionner.
Donc on peut être précis pour qu'il n'y ait plus de cas, mais on voit qu'on n'a pas toujours besoin d'une classe ou d'un identifiant pour pouvoir modifier les choses par css.
Il me semble que cela peut nous sortir de bien des ennuis, c'est pourquoi je vous apporte ce tutoriel, j'espère qu'il vous a plu, à la prochaine 😉