Un menu responsive

L’exercice présenté dans cet article consiste à créer un menu responsive pour un site fictif de galeries de photos, c’est-à-dire un menu dont la disposition va s’adapter en fonction de l’écran de chaque visiteur. Il est important de renseigner une balise meta name= »viewport » dans le Head ainsi qu’un label avec un élément input type= »checkbox » associé pour permettre de déplier et de…Continue reading Un menu responsive

Bootstrap

Une définition de Wikipedia : Bootstrap est une collection d’outils utiles à la création du design (graphisme, animation et interactions avec la page dans le navigateur … etc. …) de sites et d’applications web. C’est un ensemble qui contient des codes HTML et CSS, des formulaires, boutons, outils de navigation et autres éléments interactifs, ainsi que des extensions JavaScript en option. Installation de Bootstrap L’installation…Continue reading Bootstrap

Le langage SASS

Une définition de Wikipedia :   Sass (Syntactically Awesome Stylesheets) est un langage de génération de feuilles de style initialement développé par Hampton Catlin et Nathalie Weizenbaum. Sass est un langage de feuilles de style en cascade (CSS). C’est un langage de description qui est compilé en CSS. SassScript est un langage de script pouvant être utilisé à l’intérieur du code Sass. Deux…Continue reading Le langage SASS

La newsletter en html

Qu’est-ce qu’une newsletter ? Une newsletter est une lettre d’information envoyée périodiquement par mail à des abonnés. Composée de texte, illustrations, liens renvoyant vers votre site, son contenu peut être par exemple une sélection de produits, un article concernant des nouveautés dans votre entreprise. La newsletter un très bon moyen de fidéliser les clients. Trois bonnes…Continue reading La newsletter en html

Structure sémantique d’une page Web

Un extrait du site AlsaCréations : Les éléments de section HTML5 Les éléments de section (section, article, nav, aside, header, footer) segmentent des portions du document, qui possèdent une valeur sémantique particulière ; contrairement à des éléments génériques comme span ou div qui ont un rôle totalement neutre, et ne servent qu’à regrouper d’autres éléments…Continue reading Structure sémantique d’une page Web

Construire des tableaux en HTML

Les tableaux, obsolètes depuis l’utilisation du CSS, servent encore pour les newsletters. Fusion de cellules à l’horizontale : colspan= »2″ (pour 2 cellules) Fusion de cellules à la verticale : rowspan= »2″ (pour 2 cellules) Fusion de cellules à l’horizontale et la verticale : colspan= »2″ rowspan= »2″ (pour 2 cellules à l’horizontale et 2 cellules à la verticale)…Continue reading Construire des tableaux en HTML

Structurer et mettre en forme du texte pour le Web

Un document HTML commence toujours par : <!DOCTYPE html> <html lang=« en »> Puis, c’est suivi par : <head> <meta charset=« UTF-8 »> <title>Document</title> <link rel=« stylesheet » type=« text/css » href=« css/styles.css »> </head> La balise meta est une balise orpheline. UTF-8 est le type de codage de caractère utilisé dans le document. Quelques raccourcis de Brackets pratiques utilisés couramment : ctrl + Alt…Continue reading Structurer et mettre en forme du texte pour le Web