Attribut de style vs paramètre ID et Css externe

Question

Je comprends l'idée de conserver tous les éléments de présentation en dehors du balisage et de les placer dans un fichier .css externe.

Je veux avoir une idée des types de situations pour lesquelles vous justifieriez l’utilisation de l’attribut style par rapport aux ID de paramètres et aux Css externes.

Jusqu'à présent, j'ai beaucoup utilisé l'attribut style. Je l'utilise généralement pour spécifier des éléments de présentation spécifiques à cet élément, ainsi que tout élément de tous les éléments que je récupère dans un fichier css externe, mais j'aimerais réévaluer. ma position et faire le meilleur choix pour l’avenir.

Answer 1

Utilisez un CSS externe pour les définitions statiques. Utilisez les recherches d’ID d’élément et l’attribut style pour les éléments qui changent au moment de l’exécution ou lorsque vous avez besoin de Javascript pour les configurer, car CSS n’est pas capable de ce que vous voulez.

Un bon exemple de ce dernier est le zébrage dans jQuery avant la prise en charge généralisée des sélecteurs CSS 3 :

$(document).ready = function() {
    $("table tr:nth-child(even)").addClass("striped");
});

Aujourd'hui, vous pouvez le faire dans le CSS statique, mais il était une fois, le faire en Javascript était la meilleure option.

Answer 2

J'utilise des feuilles de style externes et les raisons en sont les suivantes:

1. Facilité de maintenance: il est beaucoup plus facile de regrouper tous mes documents de présentation dans un seul fichier.
2. Garder le code au sec - oui, celui-ci à nouveau. Auparavant, j’utilisais même l’attribut style pour définir l’affichage sur "bloc". ou " none " de façon interchangeable. À présent, je viens d'utiliser une classe appelée "masquer". et utilisez cette classe si quelque chose doit être caché et supprimez-le si quelque chose doit être montré. En cette époque d'applications Ajax complètes, je garde mon code libre de répéter de telles choses et c'est beaucoup plus propre.
3. Cela vous aide lorsque vous travaillez dans un grand projet - dans mon dernier lieu de travail, nous avions une suite d'applications qui partageait le même aspect. En mettant tout cela dans une feuille de style externe, y compris les styles qui seront invoqués après qu'un certain événement se soit produit, l'équipe a pu appliquer une conception d'interface utilisateur cohérente aux applications.

J'ai essayé de penser aux raisons d'utiliser des attributs de style, mais honnêtement, je peux dire que je ne l'utilise que lorsque je suis paresseux pour ouvrir la feuille de style afin de changer quelque chose rapidement (pas trop fier de cette partie, alors j'essaie de minimiser ça)

Answer 3

L'un des gros avantages du déplacement de tous vos styles dans une feuille de style est la facilité de maintenance. La recherche de styles en ligne peut être très pénible pour d’autres personnes qui tentent de maintenir votre code.

Pour cette seule raison, cela vaut la peine d'attribuer un ID à l'élément spécifique et de définir ses styles dans la feuille de style.

Deuxièmement, si vous écrivez beaucoup de styles en ligne, vous pourriez probablement en factoriser d'autres en utilisant les propriétés d'héritage de CSS ou quelques classes bien factorisées en plus de l'ID.

En termes de performances, la sélection des identifiants est aussi rapide que CSS, de sorte que l'utilisation de nombreuses classes est en réalité plus lente que l'exploration en profondeur des identifiants, même si ce n'est que par microsecondes.

Le seul temps réel qui me semble approprié pour utiliser des styles en ligne concerne des propriétés très transitoires telles que l'animation utilisant JavaScript ou le masquage et l'affichage d'un élément (bien que cela puisse également être fait avec des classes).