CSS pur : le cadre CSS le plus pur de Yahoo !

Comme vous le savez, ce n'est pas l'époque de la naissance d'Internet et les gens ont presque oublié les sites Web, avec du texte en un seul paragraphe et des hyperliens. Si vous souhaitez évoluer avec les normes Web actuelles, vous devez rendre votre site Web agréable plutôt que franchement visible. Quel que soit le langage de codage tel que HTML or PHP utilisé pour construire l'interface utilisateur, CSS sera votre outil pour rendre la page Web élégante. Lorsque nous comparons une page Web à un corps humain, HTML fonctionne comme vos os tandis que CSS est quelque chose proche de la peau et des muscles, conçu pour donner forme et structure.

Comme toutes les autres choses dans le monde de la conception et du développement, CSS a également acquis des mises à jour mineures et majeures, ce qui lui permet d'atteindre CSS3, qui est la meilleure paire lorsque HTML5 accompagne le voyage. Cependant, la star du jeu est la tendance ou le modèle CSS que vous choisissez d'utiliser ! Comme vous le savez, il existe différents frameworks CSS disponibles pour vous avec différents looks et fonctionnalités telles que Bootstrap, Zurb etc. Ce que nous vous présentons aujourd'hui est CSS pur, un framework CSS simplement coolgrid de Yahoo!, le principal géant de l'Internet. Heureusement, vous pouvez utiliser ce framework sans payer un seul centime.

CSS pur

Vous avez peut-être utilisé d'autres frameworks comme la Fondation Zurb pour créer des pages Web et des sites Web attrayants. L'utilisation du framework CSS est très utile car vous pouvez obtenir des modèles pour divers éléments de la page tels que les divisions, les formulaires, le menu, etc. C'est la même fonction que CSS pur par Yahoo! Plutôt que de télécharger et d'ajouter des fichiers au dossier « CSS », Pure CSS peut fonctionner comme Google Fonts, où vous devez ajouter une seule ligne de code pour intégrer le framework au HTML. Comme le framework est récent, il est complètement responsive. De plus, Pure CSS est l'un des frameworks les plus simples que vous puissiez trouver sur le Web. Vous pouvez soit utiliser le framework pour alimenter votre site Web, soit télécharger des modules spécifiques pour les sections de style telles que les formulaires, les menus, etc. Six modules individuels sont disponibles gratuitement. Les modules de Pure CSS sont les suivants, qui semblent être de taille légère (moins de 2 Ko) lorsqu'ils sont extraits.

• base: Éléments de base de la page Web tels que les en-têtes, les paragraphes, la typographie
• Boutons: Divers boutons avec des effets comme actif, en survol, etc.
• Les tables: Tables de base disponibles avec bordure, etc.
• Menus: Horizontal, vertical, déroulant.
• Grilles: Grilles réactives.
• Formulaires: Entrée groupée, multi-colonnes etc.

VOIR ÉGALEMENT: Bookmarklet Motifs subtils : prévisualisez les motifs d'arrière-plan sur votre site Web.

Pourquoi utiliser du CSS pur

• Moins de code inutilisé : Il est très courant que vous puissiez voir un grand nombre de code non utilisé lors de l'utilisation d'autres frameworks CSS. D'un autre côté, dans le cas de Pure CSS, vous ne rencontrerez jamais ce problème car vous pouvez utiliser la version spécifique du framework et l'utiliser pour styliser des sections spécifiques de la page Web. Bien sûr, moins de code semble encore plus génial !
• Tout à l'intérieur: Au moins dans certains autres frameworks, ils utilisent des plugins et des codes JavaScript tiers pour améliorer l'impact visuel. Cependant, Pure CSS n'utilise aucun type de plugin JS à l'exception du cas de celui utilisé dans l'effet déroulant. Moins de code tiers peut vous fournir des chargements de page plus rapides et une netteté du code.
• Modèles: Si vous n'êtes pas un expert pour concevoir votre propre mise en page pour votre site Web, Pure CSS peut vous aider dans cette section. Le site Web contient un certain nombre d'exemples de mise en page, correspondant à des sites Web avec différentes intentions telles que le marketing, la page de destination, etc.



• Constructeur de peau : Si les modèles et les styles peuvent satisfaire le concepteur créatif en vous, vous pouvez utiliser le générateur de skin de Pure CSS pour créer votre propre skin. Comme vous pouvez le deviner, le créateur de skin ne tient pas compte de votre niveau d'expertise en matière de codage.



VOIR ÉGALEMENT: Polices d'icônes : avantages et inconvénients du générateur de polices géniales.

Utiliser du CSS pur

Comme spécifié précédemment, Pure CSS a de nombreuses fonctionnalités avantageuses par rapport à d'autres frameworks. En rappelant ce que nous avons dit précédemment, vous pouvez utiliser Pure CSS via la même méthode que Google Fonts. Vous devez ajouter une seule ligne de lien de fichier externe pour apporter du style à votre page Web. Cette fonctionnalité est très utile lorsque vous devez créer des pages Web à fichier unique et lorsque vous n'avez pas assez d'espace pour mettre tous les fichiers css (je suppose que cela n'arrivera jamais). Comme Yahoo! tourne la roue du projet le projet, vous ne voulez pas vous crisper sur les erreurs de chargement ou les pannes techniques.

Si vous souhaitez utiliser les modèles CSS complets de Pure CSS, vous pouvez ajouter le code suivant à la page Web principale. Vous pouvez également cliquer sur le lien du fichier CSS et télécharger le fichier CSS afin de l'utiliser.

[html]

[/ Html]

Si vous souhaitez simplement utiliser des versions CSS spécifiques telles que des menus, des formulaires, etc., des codes spéciaux sont disponibles ainsi que des fichiers CSS dédiés. La liste des URL est la suivante :



L'utilisation du constructeur de skin de Pure CSS est également une tâche plus facile car vous pouvez contrôler les propriétés des éléments à l'aide des boutons de contrôle intuitifs de la page du constructeur de skin. Cependant, nous vous conseillons de télécharger les fichiers CSS afin de comprendre les noms des éléments. Comme nous l'avons dit, mettre ces fichiers de moins de 2 Ko ne consommera pas votre espace disque.

Le site Web de Pure CSS est configuré de telle manière que même un débutant peut insérer des éléments basés sur Pure CSS dans leurs sites Web. Vous pouvez voir une simple barre latérale sur le côté gauche, répertoriant des sections telles que des formulaires, des boutons, etc. Dans chaque page, des aperçus sont disponibles avec le code HTML pour apporter cet effet à votre site Web. Par conséquent, il est très facile d'insérer de tels éléments dans votre page Web. Vous trouverez ci-dessous l'aperçu et le code d'un formulaire de type de connexion unique.



Conclusion

Lors de l'analyse de toutes les fonctionnalités de Pure CSS, c'est l'une des contributions optimales de Yahoo! pour concevoir le monde. Yahoo! L'interface utilisateur, communément appelée YUI, prend en charge toutes les chaînes attachées à Pure CSS, ce qui rend le framework le meilleur lorsqu'il y a une comparaison. En plus d'utiliser des éléments prédéfinis, vous pouvez également personnaliser Pure CSS. Vous devez vous diriger vers le site Web Pure CSS pour utiliser et en savoir plus sur le cadre simplement compact. Faites-nous part de votre opinion sur ce framework après avoir consulté des exemples et l'avoir utilisé dans votre projet.