{"id":26534,"date":"2017-04-15T10:42:01","date_gmt":"2017-04-15T10:42:01","guid":{"rendered":"https:\/\/dev.railscarma.com\/what-is-sass-sass-basics-installation\/"},"modified":"2021-06-05T09:12:53","modified_gmt":"2021-06-05T09:12:53","slug":"vad-ar-sass-sass-basics-installation","status":"publish","type":"post","link":"https:\/\/www.railscarma.com\/sv\/blogg\/tekniska-artiklar\/vad-ar-sass-sass-basics-installation\/","title":{"rendered":"Komma ig\u00e5ng med Sass \u2013 L\u00e4r dig grunderna och dess installation"},"content":{"rendered":"<div data-elementor-type=\"wp-post\" data-elementor-id=\"26534\" class=\"elementor elementor-26534\" data-elementor-post-type=\"post\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-44e78025 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"44e78025\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-1ca09acf\" data-id=\"1ca09acf\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-552eb4c9 elementor-widget elementor-widget-text-editor\" data-id=\"552eb4c9\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p align=\"justify\">Du kanske redan har h\u00f6rt talas om Sass (Syntactically Awesome StyleSheets) och du \u00e4r intresserad av det, men har ingen aning om hur du ska st\u00e4lla in det eller inf\u00f6rliva det i ditt projekt. I den mest grundl\u00e4ggande formen \u00e4r Sass k\u00e4nd som CCS-processorn, vilket g\u00f6r det m\u00f6jligt f\u00f6r CCS-skrivningen att bli mer skicklig och snabbare. Vi kommer att g\u00e5 igenom grunderna och installationerna av Sass f\u00f6r b\u00e5de Mac och Windows.<\/p>\n\n<h2>Grundl\u00e4ggande l\u00e4rande om Sass<\/h2>\n<p align=\"justify\">Det finns n\u00e5gra inl\u00e4rningskurvor n\u00e4r det kommer till anv\u00e4ndning och installation av Sass. F\u00f6r att du ska g\u00e5 vidare med Sass-projektet beh\u00f6ver du ha minst grundl\u00e4ggande kunskaper i HTML och CSS. Du m\u00e5ste vara skicklig eller kompetent med CSS innan du f\u00f6rs\u00f6ker l\u00e4ra dig CSS-processor, vilket \u00e4r Sass.<\/p>\n<p align=\"justify\">Om du n\u00e5gonsin har \u00e4ndrat f\u00e4rgerna i din stilmall mycket tid eller \u00f6nskat att det finns ett b\u00e4ttre s\u00e4tt, eller redan hade din stilmall t\u00e4ckt med leverant\u00f6rsprefix, eller hade m\u00e4rkt att dina stilmallar var l\u00e4ngre och \u00e4r sv\u00e5ra att underh\u00e5lla, kanske de anledningarna r\u00e4ckte f\u00f6r att erbjuda att studera Sass. Jag kommer att sammanfatta n\u00e5gra av termerna f\u00f6r att du kan f\u00f6rst\u00e5 grunderna i Sass.<\/p>\n\n<ul>\n \t<li><strong>Variabel<\/strong> \u2013 det \u00e4r en lagringsbeh\u00e5llare f\u00f6r CSS-v\u00e4rdet som siffror och f\u00e4rger. Syntaxen skrevs som &quot;$variable&quot;. Denna kod kan anv\u00e4ndas i hela stilmallen efter att du definierat den.<\/li>\n \t<li><strong>H\u00e4ckande<\/strong> \u2013 det minskar upprepningen i koden och det har f\u00f6rm\u00e5gan att g\u00f6ra CSS-skrivningen enklare och snabbare.<\/li>\n \t<li><strong>Partier<\/strong> \u2013 det h\u00e4r \u00e4r CSS-filerna som b\u00f6rjar med understrecket &quot;_partial.scss&quot; och de \u00e4r inte kompilerade p\u00e5 sina egna CSS-filer utan importeras till huvudfilen.<\/li>\n \t<li><strong>Importera<\/strong> \u2013 anv\u00e4nd &quot;@import&quot; f\u00f6r att kompilera alla partialer i en enda fil.<\/li>\n \t<li><strong>Mixins<\/strong> \u2013 anv\u00e4nd &quot;@mixin&quot; f\u00f6r den upprepade CSS, som n\u00e4r leverant\u00f6rsprefixen kr\u00e4vdes.<\/li>\n \t<li><strong>F\u00f6rl\u00e4nga<\/strong> \u2013 anv\u00e4nd &quot;@extend&quot; f\u00f6r att \u00e4ndra n\u00e5gra aspekter av nyckeln f\u00f6r andra delar av samma identitet, till exempel en grupp knappar med olika f\u00e4rger.<\/li>\n \t<li><strong>Operat\u00f6rer<\/strong> \u2013 detta till\u00e5ter anv\u00e4ndaren att anv\u00e4nda matematiska ber\u00e4kningar i CSS, som att definiera bredden p\u00e5 olika delar av layouterna.<\/li>\n<\/ul>\n<h2>Installera Sass i Mac och Windows<\/h2>\n<p align=\"justify\">Sass k\u00f6rs p\u00e5 Rubys programmeringsspr\u00e5k, s\u00e5 Ruby m\u00e5ste installeras p\u00e5 din dator. F\u00f6r Mac-anv\u00e4ndare \u00e4r Ruby redan f\u00f6rinstallerad p\u00e5 OSX. Kontrollera f\u00f6r att s\u00e4kerst\u00e4lla att du k\u00f6r uppdaterad version genom att skriva &quot;ruby - v&quot;. Om siffran \u00e4r l\u00e4gre \u00e4n 2.0.0, skriv sedan &quot;do gem install ruby&quot; f\u00f6r att uppdatera. Nu kan du b\u00f6rja installera Sass.<\/p>\n<p align=\"justify\">Men i Windows \u00e4r installationen lite knepigare eftersom den inte har n\u00e5gon Ruby installerad. Om du k\u00f6r en 64-bitarsversion av Windows 7, v\u00e4lj Ruby 2.1.7 (x54). Samma sak m\u00e5ste ocks\u00e5 g\u00f6ras f\u00f6r Windows 8 och 10. Se till att v\u00e4lja &quot;L\u00e4gg till Ruby k\u00f6rbar i din PATH&quot; och forts\u00e4tt sedan. N\u00e4r Ruby \u00e4r installerad, \u00f6ppna kommandotolken och bekr\u00e4fta sedan att Ruby har installerats. Sedan kan du installera Sass genom att skriva &quot;<strong>gem install sass<\/strong>\u201d och du \u00e4r klar.<\/p>\n<strong><a href=\"https:\/\/www.railscarma.com\/sv\/\" target=\"_blank\" rel=\"noopener noreferrer\">RailsCarma<\/a><\/strong> har arbetat p\u00e5 Ruby on Rails ramverk fr\u00e5n b\u00f6rjan och har hanterat \u00f6ver 250 RoR-projekt. Kolla in v\u00e5r <a href=\"\/sv\/portfolj\/\" target=\"_blank\" rel=\"noopener noreferrer\"><strong>portf\u00f6lj<\/strong><\/a> att f\u00f6rst\u00e5 hur vi hj\u00e4lper till att f\u00f6r\u00e4ndra formen p\u00e5 mjukvaruindustrin genom att tillhandah\u00e5lla <a href=\"https:\/\/www.railscarma.com\/sv\/hyra-ruby-on-rails-utvecklare\/\">Ruby on Rails utvecklare<\/a>. <a href=\"\/sv\/kontakta-oss\/\">Kontakta oss nu!<\/a>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-75b63942 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"75b63942\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-217fabd3\" data-id=\"217fabd3\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-2ad73c45 elementor-widget elementor-widget-heading\" data-id=\"2ad73c45\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Prenumerera f\u00f6r de senaste uppdateringarna<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-50a30c85 elementor-widget elementor-widget-shortcode\" data-id=\"50a30c85\" data-element_type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\">\t\t\t\t\t<script type=\"text\/javascript\">\n\t\t\t\t\t\tvar gCaptchaSibWidget;\n                        var onloadSibCallbackInvisible = function () {\n\n                            var element = document.getElementsByClassName('sib-default-btn');\n                            var countInvisible = 0;\n                            var indexArray = [];\n                            jQuery('.sib-default-btn').each(function (index, el) {\n                                if ((jQuery(el).attr('id') == \"invisible\")) {\n                                    indexArray[countInvisible] = index;\n                                    countInvisible++\n                                }\n                            });\n\n                            jQuery('.invi-recaptcha').each(function (index, el) {\n                                grecaptcha.render(element[indexArray[index]], {\n                                    'sitekey': jQuery(el).attr('data-sitekey'),\n                                    'callback': sibVerifyCallback,\n                                });\n                            });\n                        };\n\t\t\t\t\t<\/script>\n\t\t\t\t\t                <script src=\"https:\/\/www.google.com\/recaptcha\/api.js?onload=onloadSibCallbackInvisible&render=explicit\" async defer><\/script>\n\t\t\t\t\n\t\t\t<form id=\"sib_signup_form_1\" method=\"post\" class=\"sib_signup_form\" action=\"\">\n\t\t\t\t<div class=\"sib_loader\" style=\"display:none;\"><img\n\t\t\t\t\t\t\tsrc=\"https:\/\/www.railscarma.com\/wp-includes\/images\/spinner.gif\" alt=\"lastare\"><\/div>\n\t\t\t\t<input type=\"hidden\" name=\"sib_form_action\" value=\"subscribe_form_submit\">\n\t\t\t\t<input type=\"hidden\" name=\"sib_form_id\" value=\"1\">\n                <input type=\"hidden\" name=\"sib_form_alert_notice\" value=\"Please fill out this field\">\n                <input type=\"hidden\" name=\"sib_form_invalid_email_notice\" value=\"Your email address is invalid\">\n                <input type=\"hidden\" name=\"sib_security\" value=\"d748cea384\">\n\t\t\t\t<div class=\"sib_signup_box_inside_1\">\n\t\t\t\t\t<div style=\"\/*display:none*\/\" class=\"sib_msg_disp\">\n\t\t\t\t\t<\/div>\n                                            <div id=\"sib_captcha_invisible\" class=\"invi-recaptcha\" data-sitekey=\"6LdikOAaAAAAAJ6SWrrKVQrtw7TQpQAEnv0HS0G3\"><\/div>\n                    \t\t\t\t\t<p class=\"sib-email-area\">\r\n    <label class=\"sib-email-area\"><\/label>\r\n    <input type=\"email\" class=\"sib-email-area\" name=\"email\" required=\"required\" placeholder=\"E-postadress\">\r\n<\/p>\r\n<p class=\"sib-NAME-area\">\r\n    <label class=\"sib-NAME-area\"><\/label>\r\n    <input type=\"text\" class=\"sib-NAME-area\" name=\"NAME\" placeholder=\"namn\">\r\n<\/p>\r\n<p>\r\n    <input type=\"submit\" id=\"invisible\" class=\"sib-default-btn\" value=\"Prenumerera\">\r\n<\/p>\t\t\t\t<\/div>\n\t\t\t<input type=\"hidden\" name=\"trp-form-language\" value=\"sv\"\/><\/form>\n\t\t\t<style>\n\t\t\t\tform#sib_signup_form_1 p.sib-alert-message {\n    padding: 6px 12px;\n    margin-bottom: 20px;\n    border: 1px solid transparent;\n    border-radius: 4px;\n    -webkit-box-sizing: border-box;\n    -moz-box-sizing: border-box;\n    box-sizing: border-box;\n}\nform#sib_signup_form_1 p.sib-alert-message-error {\n    background-color: #f2dede;\n    border-color: #ebccd1;\n    color: #a94442;\n}\nform#sib_signup_form_1 p.sib-alert-message-success {\n    background-color: #dff0d8;\n    border-color: #d6e9c6;\n    color: #3c763d;\n}\nform#sib_signup_form_1 p.sib-alert-message-warning {\n    background-color: #fcf8e3;\n    border-color: #faebcc;\n    color: #8a6d3b;\n}\n\t\t\t<\/style>\n\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t  <div class=\"related-post slider\">\r\n        <div class=\"headline\">relaterade inl\u00e4gg<\/div>\r\n    <div class=\"post-list owl-carousel\">\r\n\r\n            <div class=\"item\">\r\n            <div class=\"thumb post_thumb\">\r\n    <a  title=\"Kaminari Gem\" href=\"https:\/\/www.railscarma.com\/sv\/blogg\/tekniska-artiklar\/kaminari-parla\/?related_post_from=37277\">\r\n\r\n      <img decoding=\"async\" width=\"800\" height=\"300\" src=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2023\/04\/kaminari-gem.jpg\" class=\"attachment-full size-full wp-post-image\" alt=\"kaminari p\u00e4rla\" srcset=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2023\/04\/kaminari-gem.jpg 800w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2023\/04\/kaminari-gem-300x113.jpg 300w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2023\/04\/kaminari-gem-768x288.jpg 768w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\r\n\r\n    <\/a>\r\n  <\/div>\r\n\r\n  <a class=\"title post_title\"  title=\"Kaminari Gem\" href=\"https:\/\/www.railscarma.com\/sv\/blogg\/tekniska-artiklar\/kaminari-parla\/?related_post_from=37277\">\r\n        Kaminari Gem  <\/a>\r\n\r\n        <\/div>\r\n              <div class=\"item\">\r\n            <div class=\"thumb post_thumb\">\r\n    <a  title=\"Varf\u00f6r anst\u00e4lla Ruby on Rails-utvecklare 2026?\" href=\"https:\/\/www.railscarma.com\/sv\/blogg\/ror\/varfor-anlita-utvecklare-av-ruby-on-rails\/?related_post_from=30627\">\r\n\r\n      <img decoding=\"async\" width=\"800\" height=\"300\" src=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2019\/01\/why-to-hire-ruby-on-rails-developers-in-2022.jpg\" class=\"attachment-full size-full wp-post-image\" alt=\"varf\u00f6r anlita utvecklare av ruby on rails 2022\" srcset=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2019\/01\/why-to-hire-ruby-on-rails-developers-in-2022.jpg 800w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2019\/01\/why-to-hire-ruby-on-rails-developers-in-2022-300x113.jpg 300w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2019\/01\/why-to-hire-ruby-on-rails-developers-in-2022-768x288.jpg 768w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\r\n\r\n    <\/a>\r\n  <\/div>\r\n\r\n  <a class=\"title post_title\"  title=\"Varf\u00f6r anst\u00e4lla Ruby on Rails-utvecklare 2026?\" href=\"https:\/\/www.railscarma.com\/sv\/blogg\/ror\/varfor-anlita-utvecklare-av-ruby-on-rails\/?related_post_from=30627\">\r\n        Varf\u00f6r anst\u00e4lla Ruby on Rails-utvecklare 2026?  <\/a>\r\n\r\n        <\/div>\r\n              <div class=\"item\">\r\n            <div class=\"thumb post_thumb\">\r\n    <a  title=\"Betydelsen av mjukvaruarkitektur vid utveckling av f\u00f6retagsmjukvara\" href=\"https:\/\/www.railscarma.com\/sv\/blogg\/ror\/vikten-av-mjukvaruarkitektur-i-foretagsutveckling-av-programvara\/?related_post_from=36250\">\r\n\r\n      <img decoding=\"async\" width=\"800\" height=\"300\" src=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2022\/06\/Importance-of-Software-Architecture-in-enterprise-software-development.jpg\" class=\"attachment-full size-full wp-post-image\" alt=\"Betydelsen av mjukvaruarkitektur vid utveckling av f\u00f6retagsmjukvara\" srcset=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2022\/06\/Importance-of-Software-Architecture-in-enterprise-software-development.jpg 800w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2022\/06\/Importance-of-Software-Architecture-in-enterprise-software-development-300x113.jpg 300w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2022\/06\/Importance-of-Software-Architecture-in-enterprise-software-development-768x288.jpg 768w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\r\n\r\n    <\/a>\r\n  <\/div>\r\n\r\n  <a class=\"title post_title\"  title=\"Betydelsen av mjukvaruarkitektur vid utveckling av f\u00f6retagsmjukvara\" href=\"https:\/\/www.railscarma.com\/sv\/blogg\/ror\/vikten-av-mjukvaruarkitektur-i-foretagsutveckling-av-programvara\/?related_post_from=36250\">\r\n        Betydelsen av mjukvaruarkitektur vid utveckling av f\u00f6retagsmjukvara  <\/a>\r\n\r\n        <\/div>\r\n              <div class=\"item\">\r\n            <div class=\"thumb post_thumb\">\r\n    <a  title=\"Ruby IDE: De b\u00e4sta IDE:erna f\u00f6r Ruby on Rails Development\" href=\"https:\/\/www.railscarma.com\/sv\/blogg\/ror\/ruby-ide-de-basta-ideerna-for-ruby-on-rails-utveckling\/?related_post_from=36125\">\r\n\r\n      <img decoding=\"async\" width=\"800\" height=\"300\" src=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2022\/01\/BEST-IDES-FOR-RUBY-ON-RAILS-DEVELOPMENT.jpg\" class=\"attachment-full size-full wp-post-image\" alt=\"B\u00c4STA ID\u00c9ER F\u00d6R UTVECKLING AV RUBY ON RAIL\" srcset=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2022\/01\/BEST-IDES-FOR-RUBY-ON-RAILS-DEVELOPMENT.jpg 800w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2022\/01\/BEST-IDES-FOR-RUBY-ON-RAILS-DEVELOPMENT-300x113.jpg 300w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2022\/01\/BEST-IDES-FOR-RUBY-ON-RAILS-DEVELOPMENT-768x288.jpg 768w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\r\n\r\n    <\/a>\r\n  <\/div>\r\n\r\n  <a class=\"title post_title\"  title=\"Ruby IDE: De b\u00e4sta IDE:erna f\u00f6r Ruby on Rails Development\" href=\"https:\/\/www.railscarma.com\/sv\/blogg\/ror\/ruby-ide-de-basta-ideerna-for-ruby-on-rails-utveckling\/?related_post_from=36125\">\r\n        Ruby IDE: De b\u00e4sta IDE:erna f\u00f6r Ruby on Rails Development  <\/a>\r\n\r\n        <\/div>\r\n      \r\n  <\/div>\r\n\r\n  <script>\r\n      <\/script>\r\n  <style>\r\n    .related-post {}\r\n\r\n    .related-post .post-list {\r\n      text-align: left;\r\n          }\r\n\r\n    .related-post .post-list .item {\r\n      margin: 10px;\r\n      padding: 10px;\r\n          }\r\n\r\n    .related-post .headline {\r\n      font-size: 14px !important;\r\n      color: #999999 !important;\r\n          }\r\n\r\n    .related-post .post-list .item .post_thumb {\r\n      max-height: 220px;\r\n      margin: 10px 0px;\r\n      padding: 0px;\r\n      display: block;\r\n          }\r\n\r\n    .related-post .post-list .item .post_title {\r\n      font-size: 14px;\r\n      color: #000000;\r\n      margin: 10px 0px;\r\n      padding: 0px;\r\n      display: block;\r\n      text-decoration: none;\r\n          }\r\n\r\n    .related-post .post-list .item .post_excerpt {\r\n      font-size: 12px;\r\n      color: #3f3f3f;\r\n      margin: 10px 0px;\r\n      padding: 0px;\r\n      display: block;\r\n      text-decoration: none;\r\n          }\r\n\r\n    .related-post .owl-dots .owl-dot {\r\n          }\r\n\r\n      <\/style>\r\n      <script>\r\n      jQuery(document).ready(function($) {\r\n        $(\".related-post .post-list\").owlCarousel({\r\n          items: 2,\r\n          responsiveClass: true,\r\n          responsive: {\r\n            0: {\r\n              items: 1,\r\n            },\r\n            768: {\r\n              items: 2,\r\n            },\r\n            1200: {\r\n              items: 2,\r\n            }\r\n          },\r\n                      rewind: true,\r\n                                loop: true,\r\n                                center: false,\r\n                                autoplay: true,\r\n            autoplayHoverPause: true,\r\n                                nav: true,\r\n            navSpeed: 1000,\r\n            navText: ['<i class=\"fas fa-chevron-left\"><\/i>', '<i class=\"fas fa-chevron-right\"><\/i>'],\r\n                                dots: false,\r\n            dotsSpeed: 1200,\r\n                                                    rtl: false,\r\n          \r\n        });\r\n      });\r\n    <\/script>\r\n  <\/div>","protected":false},"excerpt":{"rendered":"<p>Perhaps you already heard about Sass (Syntactically Awesome StyleSheets) and you are interested in it, but don\u2019t have an idea about how to set it up or incorporate it into your project. In the most basic form, Sass is known as the CCS processor, which makes it possible for the CCS writing to become more &hellip;<\/p>\n<p class=\"read-more\"> <a class=\"\" href=\"https:\/\/www.railscarma.com\/sv\/blogg\/how-to-build-a-scalable-saas-platform-using-ruby-on-rails\/\"> <span class=\"screen-reader-text\">Hur man bygger en skalbar SaaS-plattform med Ruby on Rails<\/span> L\u00e4s mer \u00bb<\/a><\/p>","protected":false},"author":1,"featured_media":31784,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[384],"tags":[],"class_list":["post-26534","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-technical-articles"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.8 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Getting Started with Sass - Learning the Basics and Its Installation - RailsCarma - Ruby on Rails Development Company specializing in Offshore Development<\/title>\n<meta name=\"description\" content=\"Perhaps you already heard about Sass (Syntactically Awesome StyleSheets) and you are interested in it, but don\u2019t have an idea about how to set it up or\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.railscarma.com\/sv\/blogg\/tekniska-artiklar\/vad-ar-sass-sass-basics-installation\/\" \/>\n<meta property=\"og:locale\" content=\"sv_SE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Getting Started with Sass - Learning the Basics and Its Installation - RailsCarma - Ruby on Rails Development Company specializing in Offshore Development\" \/>\n<meta property=\"og:description\" content=\"Perhaps you already heard about Sass (Syntactically Awesome StyleSheets) and you are interested in it, but don\u2019t have an idea about how to set it up or\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.railscarma.com\/sv\/blogg\/tekniska-artiklar\/vad-ar-sass-sass-basics-installation\/\" \/>\n<meta property=\"og:site_name\" content=\"RailsCarma - Ruby on Rails Development Company specializing in Offshore Development\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/RailsCarma\/\" \/>\n<meta property=\"article:published_time\" content=\"2017-04-15T10:42:01+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-06-05T09:12:53+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2017\/04\/Sass-Basics-and-Its-Installation-1.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"800\" \/>\n\t<meta property=\"og:image:height\" content=\"300\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"admin\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@railscarma\" \/>\n<meta name=\"twitter:site\" content=\"@railscarma\" \/>\n<meta name=\"twitter:label1\" content=\"Skriven av\" \/>\n\t<meta name=\"twitter:data1\" content=\"admin\" \/>\n\t<meta name=\"twitter:label2\" content=\"Ber\u00e4knad l\u00e4stid\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minuter\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.railscarma.com\/de\/blog\/technical-articles\/was-ist-die-sass-sass-basics-installation\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.railscarma.com\/de\/blog\/technical-articles\/was-ist-die-sass-sass-basics-installation\/\"},\"author\":{\"name\":\"admin\",\"@id\":\"https:\/\/www.railscarma.com\/#\/schema\/person\/5f2228a2dec7549056e709de6eb85d21\"},\"headline\":\"Getting Started with Sass &#8211; Learning the Basics and Its Installation\",\"datePublished\":\"2017-04-15T10:42:01+00:00\",\"dateModified\":\"2021-06-05T09:12:53+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.railscarma.com\/de\/blog\/technical-articles\/was-ist-die-sass-sass-basics-installation\/\"},\"wordCount\":583,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.railscarma.com\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.railscarma.com\/de\/blog\/technical-articles\/was-ist-die-sass-sass-basics-installation\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2017\/04\/Sass-Basics-and-Its-Installation-1.jpg\",\"articleSection\":[\"Technical Articles\"],\"inLanguage\":\"sv-SE\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.railscarma.com\/de\/blog\/technical-articles\/was-ist-die-sass-sass-basics-installation\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.railscarma.com\/de\/blog\/technical-articles\/was-ist-die-sass-sass-basics-installation\/\",\"url\":\"https:\/\/www.railscarma.com\/de\/blog\/technical-articles\/was-ist-die-sass-sass-basics-installation\/\",\"name\":\"Getting Started with Sass - Learning the Basics and Its Installation - RailsCarma - Ruby on Rails Development Company specializing in Offshore Development\",\"isPartOf\":{\"@id\":\"https:\/\/www.railscarma.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.railscarma.com\/de\/blog\/technical-articles\/was-ist-die-sass-sass-basics-installation\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.railscarma.com\/de\/blog\/technical-articles\/was-ist-die-sass-sass-basics-installation\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2017\/04\/Sass-Basics-and-Its-Installation-1.jpg\",\"datePublished\":\"2017-04-15T10:42:01+00:00\",\"dateModified\":\"2021-06-05T09:12:53+00:00\",\"description\":\"Perhaps you already heard about Sass (Syntactically Awesome StyleSheets) and you are interested in it, but don\u2019t have an idea about how to set it up or\",\"breadcrumb\":{\"@id\":\"https:\/\/www.railscarma.com\/de\/blog\/technical-articles\/was-ist-die-sass-sass-basics-installation\/#breadcrumb\"},\"inLanguage\":\"sv-SE\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.railscarma.com\/de\/blog\/technical-articles\/was-ist-die-sass-sass-basics-installation\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"sv-SE\",\"@id\":\"https:\/\/www.railscarma.com\/de\/blog\/technical-articles\/was-ist-die-sass-sass-basics-installation\/#primaryimage\",\"url\":\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2017\/04\/Sass-Basics-and-Its-Installation-1.jpg\",\"contentUrl\":\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2017\/04\/Sass-Basics-and-Its-Installation-1.jpg\",\"width\":800,\"height\":300},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.railscarma.com\/de\/blog\/technical-articles\/was-ist-die-sass-sass-basics-installation\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.railscarma.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Getting Started with Sass &#8211; Learning the Basics and Its Installation\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.railscarma.com\/#website\",\"url\":\"https:\/\/www.railscarma.com\/\",\"name\":\"RailsCarma - Ruby on Rails Development Company specializing in Offshore Development\",\"description\":\"RailsCarma is a Ruby on Rails Development Company in Bangalore. We specialize in Offshore Ruby on Rails Development based out in USA and India. Hire experienced Ruby on Rails developers for the ultimate Web Experience.\",\"publisher\":{\"@id\":\"https:\/\/www.railscarma.com\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.railscarma.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"sv-SE\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.railscarma.com\/#organization\",\"name\":\"RailsCarma\",\"url\":\"https:\/\/www.railscarma.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"sv-SE\",\"@id\":\"https:\/\/www.railscarma.com\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2020\/08\/railscarma_logo.png\",\"contentUrl\":\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2020\/08\/railscarma_logo.png\",\"width\":200,\"height\":46,\"caption\":\"RailsCarma\"},\"image\":{\"@id\":\"https:\/\/www.railscarma.com\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/RailsCarma\/\",\"https:\/\/x.com\/railscarma\",\"https:\/\/www.linkedin.com\/company\/railscarma\/\",\"https:\/\/myspace.com\/railscarma\",\"https:\/\/in.pinterest.com\/railscarma\/\",\"https:\/\/www.youtube.com\/channel\/UCx3Wil-aAnDARuatTEyMdpg\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.railscarma.com\/#\/schema\/person\/5f2228a2dec7549056e709de6eb85d21\",\"name\":\"admin\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"sv-SE\",\"@id\":\"https:\/\/www.railscarma.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/308867ca6c81f3aba146080c601000087180326f752c4116849ea9f514c6a4fa?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/308867ca6c81f3aba146080c601000087180326f752c4116849ea9f514c6a4fa?s=96&d=mm&r=g\",\"caption\":\"admin\"},\"sameAs\":[\"https:\/\/www.railscarma.com\/hire-ruby-on-rails-developer\/\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Komma ig\u00e5ng med Sass - L\u00e4r dig grunderna och dess installation - RailsCarma - Ruby on Rails Development Company specialiserat p\u00e5 offshoreutveckling","description":"Kanske har du redan h\u00f6rt talas om Sass (Syntactically Awesome StyleSheets) och du \u00e4r intresserad av det, men har ingen aning om hur man st\u00e4ller in det eller","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:\/\/www.railscarma.com\/sv\/blogg\/tekniska-artiklar\/vad-ar-sass-sass-basics-installation\/","og_locale":"sv_SE","og_type":"article","og_title":"Getting Started with Sass - Learning the Basics and Its Installation - RailsCarma - Ruby on Rails Development Company specializing in Offshore Development","og_description":"Perhaps you already heard about Sass (Syntactically Awesome StyleSheets) and you are interested in it, but don\u2019t have an idea about how to set it up or","og_url":"https:\/\/www.railscarma.com\/sv\/blogg\/tekniska-artiklar\/vad-ar-sass-sass-basics-installation\/","og_site_name":"RailsCarma - Ruby on Rails Development Company specializing in Offshore Development","article_publisher":"https:\/\/www.facebook.com\/RailsCarma\/","article_published_time":"2017-04-15T10:42:01+00:00","article_modified_time":"2021-06-05T09:12:53+00:00","og_image":[{"width":800,"height":300,"url":"https:\/\/www.railscarma.com\/wp-content\/uploads\/2017\/04\/Sass-Basics-and-Its-Installation-1.jpg","type":"image\/jpeg"}],"author":"admin","twitter_card":"summary_large_image","twitter_creator":"@railscarma","twitter_site":"@railscarma","twitter_misc":{"Skriven av":"admin","Ber\u00e4knad l\u00e4stid":"3 minuter"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.railscarma.com\/de\/blog\/technical-articles\/was-ist-die-sass-sass-basics-installation\/#article","isPartOf":{"@id":"https:\/\/www.railscarma.com\/de\/blog\/technical-articles\/was-ist-die-sass-sass-basics-installation\/"},"author":{"name":"admin","@id":"https:\/\/www.railscarma.com\/#\/schema\/person\/5f2228a2dec7549056e709de6eb85d21"},"headline":"Getting Started with Sass &#8211; Learning the Basics and Its Installation","datePublished":"2017-04-15T10:42:01+00:00","dateModified":"2021-06-05T09:12:53+00:00","mainEntityOfPage":{"@id":"https:\/\/www.railscarma.com\/de\/blog\/technical-articles\/was-ist-die-sass-sass-basics-installation\/"},"wordCount":583,"commentCount":0,"publisher":{"@id":"https:\/\/www.railscarma.com\/#organization"},"image":{"@id":"https:\/\/www.railscarma.com\/de\/blog\/technical-articles\/was-ist-die-sass-sass-basics-installation\/#primaryimage"},"thumbnailUrl":"https:\/\/www.railscarma.com\/wp-content\/uploads\/2017\/04\/Sass-Basics-and-Its-Installation-1.jpg","articleSection":["Technical Articles"],"inLanguage":"sv-SE","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.railscarma.com\/de\/blog\/technical-articles\/was-ist-die-sass-sass-basics-installation\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.railscarma.com\/de\/blog\/technical-articles\/was-ist-die-sass-sass-basics-installation\/","url":"https:\/\/www.railscarma.com\/de\/blog\/technical-articles\/was-ist-die-sass-sass-basics-installation\/","name":"Komma ig\u00e5ng med Sass - L\u00e4r dig grunderna och dess installation - RailsCarma - Ruby on Rails Development Company specialiserat p\u00e5 offshoreutveckling","isPartOf":{"@id":"https:\/\/www.railscarma.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.railscarma.com\/de\/blog\/technical-articles\/was-ist-die-sass-sass-basics-installation\/#primaryimage"},"image":{"@id":"https:\/\/www.railscarma.com\/de\/blog\/technical-articles\/was-ist-die-sass-sass-basics-installation\/#primaryimage"},"thumbnailUrl":"https:\/\/www.railscarma.com\/wp-content\/uploads\/2017\/04\/Sass-Basics-and-Its-Installation-1.jpg","datePublished":"2017-04-15T10:42:01+00:00","dateModified":"2021-06-05T09:12:53+00:00","description":"Kanske har du redan h\u00f6rt talas om Sass (Syntactically Awesome StyleSheets) och du \u00e4r intresserad av det, men har ingen aning om hur man st\u00e4ller in det eller","breadcrumb":{"@id":"https:\/\/www.railscarma.com\/de\/blog\/technical-articles\/was-ist-die-sass-sass-basics-installation\/#breadcrumb"},"inLanguage":"sv-SE","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.railscarma.com\/de\/blog\/technical-articles\/was-ist-die-sass-sass-basics-installation\/"]}]},{"@type":"ImageObject","inLanguage":"sv-SE","@id":"https:\/\/www.railscarma.com\/de\/blog\/technical-articles\/was-ist-die-sass-sass-basics-installation\/#primaryimage","url":"https:\/\/www.railscarma.com\/wp-content\/uploads\/2017\/04\/Sass-Basics-and-Its-Installation-1.jpg","contentUrl":"https:\/\/www.railscarma.com\/wp-content\/uploads\/2017\/04\/Sass-Basics-and-Its-Installation-1.jpg","width":800,"height":300},{"@type":"BreadcrumbList","@id":"https:\/\/www.railscarma.com\/de\/blog\/technical-articles\/was-ist-die-sass-sass-basics-installation\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.railscarma.com\/"},{"@type":"ListItem","position":2,"name":"Getting Started with Sass &#8211; Learning the Basics and Its Installation"}]},{"@type":"WebSite","@id":"https:\/\/www.railscarma.com\/#website","url":"https:\/\/www.railscarma.com\/","name":"RailsCarma - Ruby on Rails Development Company specialiserat p\u00e5 Offshore Development","description":"RailsCarma \u00e4r ett Ruby on Rails Development Company i Bangalore. Vi \u00e4r specialiserade p\u00e5 Offshore Ruby on Rails Development baserat i USA och Indien. Anst\u00e4ll erfarna Ruby on Rails-utvecklare f\u00f6r den ultimata webbupplevelsen.","publisher":{"@id":"https:\/\/www.railscarma.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.railscarma.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"sv-SE"},{"@type":"Organization","@id":"https:\/\/www.railscarma.com\/#organization","name":"RailsCarma","url":"https:\/\/www.railscarma.com\/","logo":{"@type":"ImageObject","inLanguage":"sv-SE","@id":"https:\/\/www.railscarma.com\/#\/schema\/logo\/image\/","url":"https:\/\/www.railscarma.com\/wp-content\/uploads\/2020\/08\/railscarma_logo.png","contentUrl":"https:\/\/www.railscarma.com\/wp-content\/uploads\/2020\/08\/railscarma_logo.png","width":200,"height":46,"caption":"RailsCarma"},"image":{"@id":"https:\/\/www.railscarma.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/RailsCarma\/","https:\/\/x.com\/railscarma","https:\/\/www.linkedin.com\/company\/railscarma\/","https:\/\/myspace.com\/railscarma","https:\/\/in.pinterest.com\/railscarma\/","https:\/\/www.youtube.com\/channel\/UCx3Wil-aAnDARuatTEyMdpg"]},{"@type":"Person","@id":"https:\/\/www.railscarma.com\/#\/schema\/person\/5f2228a2dec7549056e709de6eb85d21","name":"administration","image":{"@type":"ImageObject","inLanguage":"sv-SE","@id":"https:\/\/www.railscarma.com\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/308867ca6c81f3aba146080c601000087180326f752c4116849ea9f514c6a4fa?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/308867ca6c81f3aba146080c601000087180326f752c4116849ea9f514c6a4fa?s=96&d=mm&r=g","caption":"admin"},"sameAs":["https:\/\/www.railscarma.com\/hire-ruby-on-rails-developer\/"]}]}},"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/www.railscarma.com\/sv\/wp-json\/wp\/v2\/posts\/26534","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.railscarma.com\/sv\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.railscarma.com\/sv\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.railscarma.com\/sv\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.railscarma.com\/sv\/wp-json\/wp\/v2\/comments?post=26534"}],"version-history":[{"count":0,"href":"https:\/\/www.railscarma.com\/sv\/wp-json\/wp\/v2\/posts\/26534\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.railscarma.com\/sv\/wp-json\/wp\/v2\/media\/31784"}],"wp:attachment":[{"href":"https:\/\/www.railscarma.com\/sv\/wp-json\/wp\/v2\/media?parent=26534"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.railscarma.com\/sv\/wp-json\/wp\/v2\/categories?post=26534"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.railscarma.com\/sv\/wp-json\/wp\/v2\/tags?post=26534"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}