{"id":1695,"date":"2017-03-08T09:54:39","date_gmt":"2017-03-08T08:54:39","guid":{"rendered":"http:\/\/www.bocciolesi.fr\/tutoriels-et-cours\/?p=1695"},"modified":"2017-03-20T12:01:49","modified_gmt":"2017-03-20T11:01:49","slug":"sass","status":"publish","type":"post","link":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/sass\/","title":{"rendered":"SASS COMPASS &#8211; Le CSS revisit\u00e9"},"content":{"rendered":"<div class=\"pdfprnt-buttons pdfprnt-buttons-post pdfprnt-top-right\"><a href=\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-json\/wp\/v2\/posts\/1695?print=pdf\" class=\"pdfprnt-button pdfprnt-button-pdf\" target=\"_blank\"><img decoding=\"async\" src=\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/plugins\/pdf-print\/images\/pdf.png\" alt=\"image_pdf\" title=\"Afficher le PDF\" \/><span class=\"pdfprnt-button-title pdfprnt-button-pdf-title\">Enregistrer en PDF<\/span><\/a><a href=\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-json\/wp\/v2\/posts\/1695?print=print\" class=\"pdfprnt-button pdfprnt-button-print\" target=\"_blank\"><\/a><\/div><h2><span style=\"color: #3366ff;\">I\u25baSASS : Syntactically Awesome Stylesheets<\/span><\/h2>\n<h3><span style=\"color: #993366;\">Partie I : Installation<\/span><\/h3>\n<p>SASS est un pr\u00e9-processeur ( un outil qui effectue des transformations sur le code source )<\/p>\n<p>Il est avec LESS l&#8217;un des 2 pr\u00e9-processeurs les plus utilis\u00e9s (Bootstrap par exemple). Less a besoin de <a href=\"https:\/\/nodejs.org\/en\/\" target=\"_blank\">node.JS<\/a> pour transpiler le code source et SASS a besoin de <a href=\"https:\/\/rubyinstaller.org\/\" target=\"_blank\">Ruby<\/a>.<br \/>\nNB : il faudra ajouter au PATH de l&#8217;utilisateur le binaire\u00a0<span style=\"color: #ff0000;\">C:\\Ruby23-x64\\bin<\/span><\/p>\n<p><a href=\"https:\/\/www.mb-creation-web.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_11h05_16.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-1708\" src=\"https:\/\/www.mb-creation-web.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_11h05_16.png\" alt=\"\" width=\"675\" height=\"582\" srcset=\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_11h05_16.png 675w, https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_11h05_16-300x259.png 300w\" sizes=\"auto, (max-width: 675px) 100vw, 675px\" \/><\/a><\/p>\n<p>Apr\u00e8s avoir install\u00e9 Ruby, en ligne de commande (console) on peut installer SASS :<\/p>\n<p><a href=\"https:\/\/www.mb-creation-web.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_10h01_26.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-1699\" src=\"https:\/\/www.mb-creation-web.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_10h01_26.png\" alt=\"\" width=\"741\" height=\"115\" srcset=\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_10h01_26.png 741w, https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_10h01_26-300x47.png 300w\" sizes=\"auto, (max-width: 741px) 100vw, 741px\" \/><\/a><\/p>\n<p>Pour v\u00e9rifier si l&#8217;installation s&#8217;est bien effectu\u00e9e :<\/p>\n<p><a href=\"https:\/\/www.mb-creation-web.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_10h03_44.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-1701\" src=\"https:\/\/www.mb-creation-web.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_10h03_44.png\" alt=\"\" width=\"714\" height=\"174\" srcset=\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_10h03_44.png 714w, https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_10h03_44-300x73.png 300w\" sizes=\"auto, (max-width: 714px) 100vw, 714px\" \/><\/a><\/p>\n<p>SASS utilise 2 syntaxes pour \u00e9crire ses r\u00e8gles CSS :<\/p>\n<ul>\n<li>SASS : syntaxe ancienne sans accolades<\/li>\n<li>SCSS : syntaxe plus moderne avec accolades et qui se rapproche des standards CSS \ud83d\ude42 , c&#8217;est celle que nous adopterons.<\/li>\n<\/ul>\n<p>Premier exemple :<\/p>\n<p><a href=\"https:\/\/www.mb-creation-web.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_10h12_38.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-1703\" src=\"https:\/\/www.mb-creation-web.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_10h12_38.png\" alt=\"\" width=\"665\" height=\"171\" srcset=\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_10h12_38.png 665w, https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_10h12_38-300x77.png 300w\" sizes=\"auto, (max-width: 665px) 100vw, 665px\" \/><\/a><\/p>\n<p>Et pour transpiler vers le fichier CSS :<\/p>\n<p><a href=\"https:\/\/www.mb-creation-web.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_10h17_48.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-1704\" src=\"https:\/\/www.mb-creation-web.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_10h17_48.png\" alt=\"\" width=\"947\" height=\"42\" srcset=\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_10h17_48.png 947w, https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_10h17_48-300x13.png 300w, https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_10h17_48-768x34.png 768w\" sizes=\"auto, (max-width: 947px) 100vw, 947px\" \/><\/a><\/p>\n<p>Afin d&#8217;automatiser la conversion du code scss en css, on peut utiliser cette syntaxe :<\/p>\n<p><a href=\"https:\/\/www.mb-creation-web.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_10h22_47.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-1705\" src=\"https:\/\/www.mb-creation-web.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_10h22_47.png\" alt=\"\" width=\"741\" height=\"87\" srcset=\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_10h22_47.png 741w, https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_10h22_47-300x35.png 300w\" sizes=\"auto, (max-width: 741px) 100vw, 741px\" \/><\/a><\/p>\n<p>ET l&#8217;on peut m\u00eame optimiser le tout en travaillant au niveau du dossier :<\/p>\n<p><a href=\"https:\/\/www.mb-creation-web.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_10h32_07.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-1706\" src=\"https:\/\/www.mb-creation-web.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_10h32_07.png\" alt=\"\" width=\"757\" height=\"105\" srcset=\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_10h32_07.png 757w, https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_10h32_07-300x42.png 300w\" sizes=\"auto, (max-width: 757px) 100vw, 757px\" \/><\/a><\/p>\n<h2><span style=\"color: #993366;\">Partie II :\u00a0Le Langage<\/span><\/h2>\n<p>\u25ba Les variables se d\u00e9finissent avec un $ : $taille-titre-h1:1.5rem;<\/p>\n<p>\u25ba L&#8217;op\u00e9rateur &amp; est l&#8217;\u00e9quivalent de this, cad qui pointe l&#8217;objet lui m\u00eame.<\/p>\n<p><a href=\"https:\/\/www.mb-creation-web.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_13h03_11.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-1710\" src=\"https:\/\/www.mb-creation-web.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_13h03_11.png\" alt=\"\" width=\"612\" height=\"308\" srcset=\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_13h03_11.png 612w, https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_13h03_11-300x150.png 300w\" sizes=\"auto, (max-width: 612px) 100vw, 612px\" \/><\/a><\/p>\n<p>\u25baLes Fonctions SASS acceptent des param\u00e8tres en entr\u00e9e et renvoient (return) une seule valeur :<\/p>\n<p><a href=\"https:\/\/www.mb-creation-web.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_13h14_58.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-1711\" src=\"https:\/\/www.mb-creation-web.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_13h14_58.png\" alt=\"\" width=\"652\" height=\"257\" srcset=\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_13h14_58.png 652w, https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_13h14_58-300x118.png 300w\" sizes=\"auto, (max-width: 652px) 100vw, 652px\" \/><\/a><\/p>\n<p>Une fonction SASS est utile pour faire des calculs mais ne renverra qu&#8217;une seule valeur et ne pourra modidier qu&#8217;un seule propri\u00e9t\u00e9 CSS \u00e0 la diff\u00e9rence des mixins<\/p>\n<p>\u25ba Les MIXINS<\/p>\n<p>Le mixin est un ensemeble de propri\u00e9t\u00e9s CSS que l&#8217;on peut r\u00e9exploiter facilement dans les documents en faisant un simple include (copier-coller)<\/p>\n<p>Les mixins peuvent \u00e9galement interpr\u00e9ter des param\u00e8tres en entr\u00e9es. S&#8217;il n&#8217;y a pas de param\u00e8tres on ne met pas de parenth\u00e8ses !<\/p>\n<p><a href=\"https:\/\/www.mb-creation-web.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_13h23_13.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-1712\" src=\"https:\/\/www.mb-creation-web.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_13h23_13.png\" alt=\"\" width=\"648\" height=\"195\" srcset=\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_13h23_13.png 648w, https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_13h23_13-300x90.png 300w\" sizes=\"auto, (max-width: 648px) 100vw, 648px\" \/><\/a><\/p>\n<h2><span style=\"color: #993366;\">PARTIE III :\u00a0Compass<\/span><\/h2>\n<p>Compass est un framework CSS3 destin\u00e9 \u00e0 optimiser le travail avec SASS. Compass sournit une grande quantit\u00e9 de Mixins.<\/p>\n<p>Comment installer compass :<\/p>\n<p><a href=\"https:\/\/www.mb-creation-web.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_13h47_42.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-1715\" src=\"https:\/\/www.mb-creation-web.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_13h47_42.png\" alt=\"\" width=\"667\" height=\"246\" srcset=\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_13h47_42.png 667w, https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2017\/03\/2017-03-08_13h47_42-300x111.png 300w\" sizes=\"auto, (max-width: 667px) 100vw, 667px\" \/><\/a><\/p>\n<p>&nbsp;<\/p>\n<p>Michel BOCCIOLESI<\/p>\n","protected":false},"excerpt":{"rendered":"<p>I\u25baSASS : Syntactically Awesome Stylesheets Partie I : Installation SASS est un pr\u00e9-processeur ( un outil qui effectue des transformations sur le code source ) Il est avec &#8230;<\/p>\n","protected":false},"author":1,"featured_media":1587,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[40,36],"tags":[],"class_list":["post-1695","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-css","category-developpement-web"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v22.9 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>SASS COMPASS - Le CSS revisit\u00e9 - Tutoriels et Cours<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/sass\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"SASS COMPASS - Le CSS revisit\u00e9 - Tutoriels et Cours\" \/>\n<meta property=\"og:description\" content=\"I\u25baSASS : Syntactically Awesome Stylesheets Partie I : Installation SASS est un pr\u00e9-processeur ( un outil qui effectue des transformations sur le code source ) Il est avec ...\" \/>\n<meta property=\"og:url\" content=\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/sass\/\" \/>\n<meta property=\"og:site_name\" content=\"Tutoriels et Cours\" \/>\n<meta property=\"article:published_time\" content=\"2017-03-08T08:54:39+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2017-03-20T11:01:49+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2016\/09\/NodeJS.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"290\" \/>\n\t<meta property=\"og:image:height\" content=\"112\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Michel BOCCIOLESI\" \/>\n<meta name=\"twitter:label1\" content=\"\u00c9crit par\" \/>\n\t<meta name=\"twitter:data1\" content=\"Michel BOCCIOLESI\" \/>\n\t<meta name=\"twitter:label2\" content=\"Dur\u00e9e de lecture estim\u00e9e\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/sass\/\",\"url\":\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/sass\/\",\"name\":\"SASS COMPASS - Le CSS revisit\u00e9 - Tutoriels et Cours\",\"isPartOf\":{\"@id\":\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/sass\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/sass\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2016\/09\/NodeJS.jpg\",\"datePublished\":\"2017-03-08T08:54:39+00:00\",\"dateModified\":\"2017-03-20T11:01:49+00:00\",\"author\":{\"@id\":\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/#\/schema\/person\/6bdfe0a1263b803645c69e3d5748dabe\"},\"breadcrumb\":{\"@id\":\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/sass\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/sass\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/sass\/#primaryimage\",\"url\":\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2016\/09\/NodeJS.jpg\",\"contentUrl\":\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2016\/09\/NodeJS.jpg\",\"width\":290,\"height\":112,\"caption\":\"Tutoriel D\u00e9veloppement Web NODEJS\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/sass\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Accueil\",\"item\":\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"SASS COMPASS &#8211; Le CSS revisit\u00e9\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/#website\",\"url\":\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/\",\"name\":\"Tutoriels et Cours\",\"description\":\"Michel Bocciolesi | Formateur Consultant en Informatique\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/#\/schema\/person\/6bdfe0a1263b803645c69e3d5748dabe\",\"name\":\"Michel BOCCIOLESI\",\"description\":\"Michel Bocciolesi est consultant et formateur sp\u00e9cialis\u00e9 en Informatique.\",\"sameAs\":[\"https:\/\/www.mb-creation-web.fr\"],\"url\":\"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/author\/michel\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"SASS COMPASS - Le CSS revisit\u00e9 - Tutoriels et Cours","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/sass\/","og_locale":"fr_FR","og_type":"article","og_title":"SASS COMPASS - Le CSS revisit\u00e9 - Tutoriels et Cours","og_description":"I\u25baSASS : Syntactically Awesome Stylesheets Partie I : Installation SASS est un pr\u00e9-processeur ( un outil qui effectue des transformations sur le code source ) Il est avec ...","og_url":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/sass\/","og_site_name":"Tutoriels et Cours","article_published_time":"2017-03-08T08:54:39+00:00","article_modified_time":"2017-03-20T11:01:49+00:00","og_image":[{"width":290,"height":112,"url":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2016\/09\/NodeJS.jpg","type":"image\/jpeg"}],"author":"Michel BOCCIOLESI","twitter_misc":{"\u00c9crit par":"Michel BOCCIOLESI","Dur\u00e9e de lecture estim\u00e9e":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/sass\/","url":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/sass\/","name":"SASS COMPASS - Le CSS revisit\u00e9 - Tutoriels et Cours","isPartOf":{"@id":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/#website"},"primaryImageOfPage":{"@id":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/sass\/#primaryimage"},"image":{"@id":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/sass\/#primaryimage"},"thumbnailUrl":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2016\/09\/NodeJS.jpg","datePublished":"2017-03-08T08:54:39+00:00","dateModified":"2017-03-20T11:01:49+00:00","author":{"@id":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/#\/schema\/person\/6bdfe0a1263b803645c69e3d5748dabe"},"breadcrumb":{"@id":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/sass\/#breadcrumb"},"inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/bocciolesi.fr\/tutoriels-et-cours\/sass\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/sass\/#primaryimage","url":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2016\/09\/NodeJS.jpg","contentUrl":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-content\/uploads\/2016\/09\/NodeJS.jpg","width":290,"height":112,"caption":"Tutoriel D\u00e9veloppement Web NODEJS"},{"@type":"BreadcrumbList","@id":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/sass\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Accueil","item":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/"},{"@type":"ListItem","position":2,"name":"SASS COMPASS &#8211; Le CSS revisit\u00e9"}]},{"@type":"WebSite","@id":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/#website","url":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/","name":"Tutoriels et Cours","description":"Michel Bocciolesi | Formateur Consultant en Informatique","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"fr-FR"},{"@type":"Person","@id":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/#\/schema\/person\/6bdfe0a1263b803645c69e3d5748dabe","name":"Michel BOCCIOLESI","description":"Michel Bocciolesi est consultant et formateur sp\u00e9cialis\u00e9 en Informatique.","sameAs":["https:\/\/www.mb-creation-web.fr"],"url":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/author\/michel\/"}]}},"_links":{"self":[{"href":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-json\/wp\/v2\/posts\/1695","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-json\/wp\/v2\/comments?post=1695"}],"version-history":[{"count":11,"href":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-json\/wp\/v2\/posts\/1695\/revisions"}],"predecessor-version":[{"id":1728,"href":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-json\/wp\/v2\/posts\/1695\/revisions\/1728"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-json\/wp\/v2\/media\/1587"}],"wp:attachment":[{"href":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-json\/wp\/v2\/media?parent=1695"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-json\/wp\/v2\/categories?post=1695"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/bocciolesi.fr\/tutoriels-et-cours\/wp-json\/wp\/v2\/tags?post=1695"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}