Unit Panzer@Security:~# keep calm, open code...

A propos...

Ce site est juste un carnet de notes mais aussi un brouillon d'expérimentations personnelles sur les technologies CSS, responsives. Bien que le site en lui même ne soit pas vraiment responsive, j'ai récup une vieille mise en page ;) Par contre, tout ce qui traîne dans mon bac à sable l'est, devrait l'être ou bien en devenir. Bon, y a aussi du SVG et bientôt d'autres trucs.


HTML.

Formulaires.

Les formulaires (en cours).[ GO! ]

CSS.

Les boîtes.

Boîtes, marges et positionnement. (en cours).[ GO! ]

Graphisme.

Les bordures (outline, border et box-shadow).[ GO! ]

Dessiner des formes géométriques simples 1/2 (cercles, ellipses).[ GO! ]

Dessiner des formes géométriques simples 2/2 (carrés, losanges, triangles).[ GO! ]

Dessiner des formes géométriques composées (todo...).[ GO! ]

box-shadow.[ GO! ]

Le texte.

Propriétés de texte, font et intégration (en cours).[ GO! ]

Font et responsiv (en cours).[ GO! ]

Font Locks (en cours).[ GO! ]

Bac à sable.

Premiers pas avec Flex et OOCSS (ébauche).[ GO! ]

Animations basiques de cercles (en cours).[ GO! ]

Interface responsiv et animation avec flex: immobilier02.[ GO! ]

Font Locks 01.[ GO! ]

Font Locks 02.[ GO! ]

Test pseudo-classes :nth().[ GO! ]

Pense-bête.

Tableau des éléments et propriétés CSS.

Elément border (en cours).[ GO! ]

Astuces.

Un peu de tout...

Boutons et design responsiv (en cours).[ GO! ]

Brouillon CSS font responsiv (en cours).[ GO! ]

Police en folie ou font dans tous ses états (en cours).[ GO! ]

Corbeille.

Tous les ratages...

Interface responsiv et animation avec flex: immobilier01.[ GO! ]


Flex.

Les bases.

Les propriétés de flex (en cours).[ GO! ]

Pense-bête.

L'essentiel de flex.

Propriétés (en cours).[ GO! ]

Bac à flex.

Test propriétés 01 - flex-basis (en cours).[ GO! ]

Formulaire responsiv 01 (en cours).[ GO! ]


Grid.

Les bases.

Les propriétés de grid (en cours).[ GO! ]


SVG.

Elements structurels.

tspan, defs, g, use (en cours).[ GO! ]

textPath, texte suivant un tracé (notions avancées todo !).[ GO! ]

Mixer les médias.

Images et vidéos avec SVG (en cours).[ GO! ]

Nutshell.

Intégrer un SVG dans du HTML et les CSS.[ GO! ]

viewport et viewbox (à finir).[ GO! ]

Inkscape.

Exercice: Appliquer une couleur à un texte mis sur un fond avec un dégradé de couleurs (en cours).[ GO! ]

Exercice: Découpe d'objets (en cours).[ GO! ]


Les animations.

Animation aves CSS.

Introduction (en cours).[ GO! ]


SASS et Compas.

Installation et Introduction.

Installation (en cours).[ GO! ]


GIT/Github.


Linux.

Apache 2.4, le minimum pour config /home (en cours).[ GO! ]

Qubes OS, installation et introduction (en cours).[ GO! ]


Réseaux.

Raspberry.


Articles à creuser.

Font-locks. Article de Florens Verschelde.[ GO! ]

Démo font-locks par Trent Walton.[ GO! ]

aspect-ratio unit css. Article de Rachel Andrew.[ GO! ]

width, height et les images. Article de Barry Pollard.[ GO! ]


On peut me trouver par là:


Keep and Try it ! Dernière mise à jour: 03/12/2020