Différence entre CSS3 et CSS

Un site Web moderne est composé de trois fichiers ou codes différents, HTML, JavaScript et CSS. HTM définit la structure d'un site Web; JavaScript définit comment le site Web se comportera; et CSS définit l'apparence globale et le style du site Web. Les spécifications CSS sont maintenues par le W3C. D'un côté, nous avons la version de base et à l'autre, le dernier et le puissant CSS3. Jetons un coup d'œil aux différences entre les deux.

Qu'est-ce que CSS?

CSS est court pour les feuilles de style en cascade. Il vous donne un contrôle créatif sur la conception globale et la disposition de vos pages Web. Le but du CSS est de rationaliser le processus de stylisation des pages Web. CSS est un langage de conception simple qui vous permet de créer des pages Web accrocheuses. Il aide à déterminer les réflexions comme la couleur, la police, le positionnement de certains éléments et un peu d'animation. Si vous avez utilisé des styles dans ces traitements de texte comme Microsoft Word ou des programmes de mise en page comme Adobe InDesign, CSS vous sentira familier. Tout élément visuel sur un site Web tel que l'arrière-plan, les boîtes, le texte, l'en-tête et le pied de page, tout peut littéralement être modifié avec CSS.

Qu'est-ce que CSS3?

CSS3 est la dernière itération du langage des feuilles de style en cascade et le numéro 3 n'est pas seulement une référence aux nouvelles fonctionnalités du CSS, mais le troisième niveau dans la progression de la spécification CSS. CSS3 est la nouvelle version modulaire de la spécification CSS avec de nouvelles fonctionnalités passionnantes pour rendre vos efforts de conception Web à un tout nouveau niveau, ce qui le rend plus facile et plus flexible. Il s'agit d'un nouveau terme couverture utilisé pour décrire les nouvelles fonctionnalités et fonctionnalités CSS qui ont émergé au cours des deux dernières années. Maintenant, une partie de cette nouvelle fonctionnalité est le développement continu du CSS à travers le W3C et une autre partie de celle-ci est dictée par une nouvelle génération de navigateurs qui sont spécialement traités pour fournir aux concepteurs des outils plus puissants pour créer des sites Web. Il apporte une pléthore de nouvelles fonctionnalités et ajouts, comme des sélecteurs avancés, des coins arrondis, de nouvelles dispositions, des animations ou des transitions, des ombres, des gradients, une sélection de couleurs, et plus encore.

Différence entre CSS3 et CSS

Sélecteurs

- Les sélecteurs sont au cœur même des feuilles de style en cascade qui sont essentiellement des motifs utilisés pour sélectionner les éléments HTML que vous souhaitez styliser. CSS3 propose une toute nouvelle boîte à outils robuste de sélecteurs avancés qui vous permettent de sélectionner des éléments plus spécifiques pour le style tout en éliminant le besoin de ces identifiants et classes arbitraires que vous incluez si souvent. Avec une si large gamme de sélecteurs, vous pouvez cibler presque n'importe quel élément de la page. CSS3 augmente la fonctionnalité de base du sélecteur d'attribut en vous permettant de sélectionner des éléments en fonction des chaînes dans les valeurs d'attribut.

Couleurs

- CSS3 offre de nouvelles façons passionnantes de jouer avec les couleurs. Avant, les couleurs ont été déclarées en utilisant le format hexadécimal - un système de numérotation qui commence à 00 et se termine à FF. La spécification des couleurs CSS3 définit une liste étendue de mots clés de couleur qui sont pris en charge par les navigateurs Web. La liste comprend désormais 147 mots clés supplémentaires de couleur et un nouveau modèle appelé «RGBA» (ajout d'alpha) qui permet la spécification de l'opacité d'une couleur. Le changement le plus important est que vous pouvez désormais déclarer des couleurs semi-transparentes.

Rayon frontalier

- La propriété CSS Border-Radius définit les coins arrondis de n'importe quel élément, vous permettant d'utiliser facilement les coins arrondis dans vos éléments de conception. Avec CSS3, vous pouvez même utiliser des images pour les bordures et créer des coins arrondis sur vos bordures sans images ou marquage supplémentaire. Il a également les ajouts de propriété d'arrière-plan tels que la possibilité d'avoir plusieurs arrière-plans et améliorations pour contrôler la taille, l'orientation et l'écrêtage de l'image d'arrière-plan. La propriété de l'ombre de la boîte vous permet d'ajouter des ombres de dépôt aux éléments.

Format de texte

- CSS3 fournit une tonne de propriétés de formatage de texte, dont beaucoup sont déjà présentes dans CSS2 mais avec des fonctionnalités supplémentaires telles que la nouvelle propriété de texto-ombre. Cette nouvelle propriété de l'ombre de texte vous permet d'ajouter des ombres à des caractères individuels dans les nœuds de texte. Un effet fantôme pour le texte rend une page Web plus vive et attrayante. Avant CSS3, vous auriez fait la même chose à l'aide d'une image ou d'un élément de texte en double, puis de le positionner.

Gradients

- Les gradients sont l'une des caractéristiques les plus attendues pour devenir originaires de CSS. Ce sont des ajouts incroyablement puissants au CSS qui vous permet de définir la couleur d'arrière-plan d'un élément sur un dégradé. Vous pouvez utiliser un gradient en deux couleurs simple et simple ou vous pouvez tout faire en utilisant de nombreux arrêts de couleur et différents niveaux d'opacité tout au long du gradient. Les gradients peuvent être linéaires ou radiaux et créer des effets visuels aussi riches visuellement que les gradients dans d'autres technologies telles que SVG.

Transitions et animations

- CSS3 a une autre caractéristique intéressante appelée transitions qui fournissent un moyen de contrôler la vitesse d'animation lorsque vous passez d'une valeur de propriété CSS à une autre. Par exemple, vous pouvez animer la hauteur d'un élément de zéro pixels à cent pixels pour révéler le contenu de l'élément. Les animations CSS3 ont leurs propres spécifications et vous permettent de créer des images clés pour contrôler les animations et les propriétés qui vous permettent de contrôler le timing, la durée et la boucle des animations.

CSS3 VS. CSS: Graphique de comparaison

Résumé de CSS3 vs. CSS

Le CSS3 est, à tous égards, un successeur digne qui contient l'homme de nouvelles fonctionnalités intéressantes pour vous aider avec vos efforts de conception Web. Il a beaucoup de fonctionnalités puissantes qui rendent votre conception Web plus simple, plus facile et flexible que jamais. CSS3 fournit non seulement aux utilisateurs une pléthore de nouvelles fonctionnalités passionnantes avec lesquelles jouer, mais plus pour fournir aux utilisateurs des moyens plus flexibles de résoudre les problèmes existants. Il y a maintenant plus de 40 modules dans CSS3 à différentes étapes de l'achèvement et du support du navigateur. D'une part, CSS3 dispose d'une toute nouvelle boîte à outils de sélecteurs avancés qui vous permettent de sélectionner des éléments plus spécifiques pour le style.