KNACSS

Outilcss

Publié par le , mis à jour le (23984 lectures)

css reset framework grid template grilles knaccs

KNACSS est une feuille de style CSS minimaliste et extensible pour débuter une intégration.

KNACSS, c'est une sorte de feuille de style CSS "reset" sur-vitaminée qui permet de commencer un projet à partir de zéro tout en tenant compte de bonnes pratiques générales (accessibilité, performance, responsive webdesign, grille de mise en forme).

Conçu par l'agence web Alsacreations.fr et pensé pour être couplé avec des préprocesseurs tel que Sass, le micro-framework KNACSS est employé quotidiennement sur toute sorte de projet web quel que soit son type ou son envergure.

KNACSS est né en 2012 et a bien mûri depuis : la version majeure 7 est publiée en 2018. 

En savoir plus

Pour commencer avec KNACSS, les ressources suivantes vous seront fort utiles :

Commentaires

Lol, moins rapide :)

t'as pas lu toute la page ???

Chez Alsacréations, et par expérience, on préfère de loin un socle de base minimaliste qui convienne tel quel à tous les nouveaux projets, mais qui puisse être progressivement enrichi. C'est le cas de KNACSS.

Et chez presse citron :
C’est dans ce constat que KNACSS a été développé par Raphaël Goetter, le talentueux créateur de la communauté Alsacréations.

Alors ?? c qui les plus rapide finalement ? ;)

Cette info, je la connais avant tous les alsanautes ;) Hier ou avant hier, je suis tombé par hasard sur cela et je voulais te féliciter Raphaël. Mais pas le temps en ce moment. Bon en tout cas je le fais ici. J'ai pas encore bien tout regarder mais je vais m'attarder dessus.

Ca me rassure de voir que je ne suis pas le seul à faire des classes .mt1 .w50 et cie.

Merci pour ça en tout cas, je vais en piquer quelques lignes.

Intéressant, d'habitude je ne suis pas trop fan des frameworks, mais comme le projet se situe justement entre un reset et un framework et qu'en plus tout ca est en français, pourquoi ne pas aller y jeter un petit coup d'oeil ;-)

Merci pour la mise à dispo. Hormis le gain de temps indéniable pour la création de feuille de style, j'y trouve également des pratiques très instructives, un condensé de cours sur les CSS actuelles en somme.
Juste une petite question lexicale : "gouttière" correspond à "gutter" en anglais, c'est bien ça ? Je traduirais ça plutôt par "marge". Mais peut-être était-ce de l'auto-promotion cachée ;D :p

Ah, j'oubliais, le décalage des bulles explicatives est encore d'actualités (la remarque avait été faite sur le site de Raphaël à ce que je me souvienne) pour Firefox 14.0.1 mais pas pour Chrome 20.0.1132.57 m.

@jojaba : hello,
En fait c'est une convention établie d'avoir francisé "gutter" en "gouttière". Cela me semble moins gênant que "marges" qui a un sens très précis en CSS et risque d'induire en erreur.

Bonjour,

Est-ce que la hauteur des lignes via les em fonctionnent dans tout les cas ?

Je pensais que lorsque l'on utilisais des % sur le html, la hauteur était calculé par apport à la valeur par défaut configuré dans le navigateur.

@jeremy685 : la hauteur des lignes n'est justement pas en "em" : elle est de 1.5 et non de 1.5em, il n'y a donc pas de cascade désagréable par exemple.

@Styus : je n'ai pas de réponse universelle et péremptoire à cette question. C'est généralement pratique d'englober plusieurs champs dans un fieldset, mais ce n'est pas forcément idéal d'entourer *chaque* input d'un fieldset.
Dans l'exemple de KNACSS, j'ai simplement récupéré le code de http://pea.rs/forms/multi-left-labels pour aller plus vite ;)

Bonjour,
Il y'avait une version compressée ressente avec des modèles de page. Puis-je les avoir ?

Merci d'avance...

Bonjour,

Apres avoir lu ce post et utilisé knacss, j'ai une question:
Pourquoi on commence par les media querie de taille desktop et non par smartphones ?
Je pensais qu'il fallait commencé par les petits écrans ?
Merci de votre réponse je trouve ce framework top et bcq plus léger que twitter bootstrap par exemple=)

Bonjour,

Apres avoir lu ce post et utilisé knacss, j'ai une question:
Pourquoi on commence par les media querie de taille desktop et non par smartphones ?
Je pensais qu'il fallait commencé par les petits écrans ?
Merci de votre réponse je trouve ce framework top et bcq plus léger que twitter bootstrap par exemple=)