{"id":3069,"date":"2013-05-13T09:10:59","date_gmt":"2013-05-13T07:10:59","guid":{"rendered":"https:\/\/www.creativejuiz.fr\/blog\/?p=3069"},"modified":"2015-04-12T20:22:40","modified_gmt":"2015-04-12T18:22:40","slug":"knacss-un-framework-css-qui-vous-la-met-w100","status":"publish","type":"post","link":"https:\/\/www.creativejuiz.fr\/blog\/css-css3\/knacss-un-framework-css-qui-vous-la-met-w100","title":{"rendered":"Knacss &#8211; Un framework CSS qui vous la met .w100"},"content":{"rendered":"<p>D\u00e9sol\u00e9 pour ce titre d&rsquo;article un peu d\u00e9cal\u00e9. Le sujet n&rsquo;en reste pas moins s\u00e9rieux.<br \/>\nDans le monde des frameworks nous avons ceux qui font tout, ceux qui servent de \u00ab\u00a0reset\u00a0\u00bb ou encore de \u00ab\u00a0kickstarter\u00a0\u00bb. <a href=\"http:\/\/knacss.com\/\" hreflang=\"en\">Knacss<\/a> en fait pas mal, et vous laisse suffisamment de libert\u00e9 pour faire le reste.<!--more--><\/p>\n<h2>L&rsquo;auteur, l&rsquo;origine<\/h2>\n<p>L&rsquo;auteur de ce framework est <a href=\"http:\/\/www.goetter.fr\/\">Rapha\u00ebl Goetter<\/a>, un frenchy Alsacien bien de chez nous qui a d\u00e9cid\u00e9 de maintenir Knacss uniquement en anglais, pour plus de facilit\u00e9.<br \/>\nLe nom \u00ab\u00a0Knacss\u00a0\u00bb ne vient pas du groupe de musique \u00ab\u00a0The knack\u00a0\u00bb, mais de la <a href=\"http:\/\/fr.wiktionary.org\/wiki\/knack\">saucisse Alsacienne, la knack<\/a>. Ce framework cr\u00e9\u00e9 en 2012 \u00e9volue au fil des supports navigateur et des divers retours sur son utilisation par des d\u00e9veloppeurs front-end de tous horizons.<\/p>\n<figure id=\"attachment_4940\" aria-labelledby=\"figcaption_attachment_4940\" class=\"wp-caption aligncenter\" style=\"width: 1920px\"><a href=\"https:\/\/www.creativejuiz.fr\/blog\/wp-content\/uploads\/2013\/05\/knacss-big.png\"><img decoding=\"async\" class=\"wp-image-4940 size-full\" src=\"https:\/\/www.creativejuiz.fr\/blog\/wp-content\/uploads\/2013\/05\/knacss-big.png\" alt=\"Knacss Framework\" width=\"1910\" height=\"732\" srcset=\"https:\/\/www.creativejuiz.fr\/blog\/wp-content\/uploads\/2013\/05\/knacss-big.png 1910w, https:\/\/www.creativejuiz.fr\/blog\/wp-content\/uploads\/2013\/05\/knacss-big-300x115.png 300w, https:\/\/www.creativejuiz.fr\/blog\/wp-content\/uploads\/2013\/05\/knacss-big-600x230.png 600w\" sizes=\"(max-width: 1910px) 100vw, 1910px\" \/><\/a><figcaption id=\"figcaption_attachment_4940\" class=\"wp-caption-text\">Logo original par St\u00e9phanie Walter<\/figcaption><\/figure>\n<h2>La base<\/h2>\n<p>Nous commen\u00e7ons souvent nos projets de la m\u00eame mani\u00e8re\u00a0: en annulant ou \u00e9crasant beaucoup de styles par d\u00e9faut appliqu\u00e9s par les navigateurs, soit pour y appliquer des r\u00e8gles de bases plus harmonieuses, soit pour y appliquer directement des r\u00e8gles g\u00e9n\u00e9riques propres au projet en cours.<\/p>\n<p>C&rsquo;est un peu l&rsquo;id\u00e9e de base de Knacss\u00a0: nos feuilles de styles reprennent souvent les m\u00eames bases, \u00e0 quelques nuances pr\u00e8s, bien entendu. Au lieu de r\u00e9inventer la roue \u00e0 chaque projet, nous partons d&rsquo;une feuille de base modulable proposant quelques styles g\u00e9n\u00e9riques.<\/p>\n<h2>Bien plus qu&rsquo;une saucisse<\/h2>\n<p>Knacss n&rsquo;est pas juste un reset CSS, il vous permet, lorsqu&rsquo;il est \u00ab\u00a0garni\u00a0\u00bb, de g\u00e9rer et styler :<\/p>\n<ul>\n<li>vos <a href=\"https:\/\/github.com\/raphaelgoetter\/KNACSS\/tree\/master\/doc\/04-tableaux.md\">tableaux<\/a> de donn\u00e9es<\/li>\n<li>vos <a href=\"https:\/\/github.com\/raphaelgoetter\/KNACSS\/tree\/master\/doc\/03-grilles.md\">grilles<\/a> de mise en page<\/li>\n<li>vos <a href=\"https:\/\/github.com\/raphaelgoetter\/KNACSS\/tree\/master\/doc\/05-formulaires.md\">\u00e9l\u00e9ments de formulaire<\/a> (section \u00ab\u00a0Formulaires\u00a0\u00bb)<\/li>\n<li>et pr\u00e9parer vos <a href=\"https:\/\/github.com\/raphaelgoetter\/KNACSS\/tree\/master\/doc\/07-responsive.md\">media-queries pour du responsive<\/a> (section \u00ab\u00a0Responsive\u00a0\u00bb)<\/li>\n<\/ul>\n<h2>La Knacss et le Schnaps.it<\/h2>\n<p>Je ne vais pas vous refaire le tutoriel complet car tout est d\u00e9j\u00e0 disponible que le site de officiel, cependant Knacss est intimement li\u00e9 \u00e0 l&rsquo;outil <a href=\"http:\/\/schnaps.it\/\">Schnaps.it<\/a> qui vous permet de composer votre mise en page de base.<\/p>\n<ol>\n<li>Rendez-vous sur se site de Schnaps.it<\/li>\n<li>S\u00e9lectionnez le mod\u00e8le mod\u00e8le de document<\/li>\n<li>Choisissez et personnaliser le gabarit<\/li>\n<li>T\u00e9l\u00e9chargez vos fichiers<\/li>\n<\/ol>\n<p>Pour le reste je vous renvoie une nouvelle fois vers <a href=\"https:\/\/github.com\/raphaelgoetter\/KNACSS\/tree\/master\/doc\">la documentation officielle<\/a>.<\/p>\n<p>Amusez-vous bien !<\/p>\n<p class=\"center\"><a class=\"download\" href=\"https:\/\/github.com\/raphaelgoetter\/KNACSS\/archive\/master.zip\">T\u00e9l\u00e9charger Knacss<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>D\u00e9sol\u00e9 pour ce titre d&rsquo;article un peu d\u00e9cal\u00e9. Le sujet n&rsquo;en reste pas moins s\u00e9rieux. Dans le monde des frameworks nous avons ceux qui font tout, ceux qui servent de \u00ab\u00a0reset\u00a0\u00bb ou encore de \u00ab\u00a0kickstarter\u00a0\u00bb. Knacss en fait pas mal, et vous laisse suffisamment de libert\u00e9 pour faire le reste.<\/p>\n","protected":false},"author":4,"featured_media":4941,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_bluesky_dont_syndicate":"","_bluesky_syndication_accounts":"","_bluesky_syndication_text":"","footnotes":""},"categories":[17],"tags":[142,515,514,516,277],"coauthors":[597],"class_list":["post-3069","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-css-css3","tag-css","tag-framework","tag-knacss","tag-minimalist","tag-raphael-goetter"],"acf":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/posts\/3069","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/comments?post=3069"}],"version-history":[{"count":0,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/posts\/3069\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/media\/4941"}],"wp:attachment":[{"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/media?parent=3069"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/categories?post=3069"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/tags?post=3069"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/coauthors?post=3069"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}