You are previewing Pragmatic Guide to Sass 3.
O'Reilly logo
Pragmatic Guide to Sass 3

Book Description

Design websites faster than ever using Sass--the most mature and popular CSS meta-language. On any platform, integrate Sass into your project, create a reusable style guide, and use maps to drastically reduce duplication in your stylesheets. You'll see how to code the right way in Sass with short, clear examples on two-page spreads that show the explanation on one side and code examples on the other. This ultimate guide to using Sass, written by its creator, is updated and expanded with all the new features found in Sass 3.4, making you an expert in no time.

Table of Contents

  1. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">&#160;</span>AcknowledgmentsAcknowledgments
  2. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">&#160;</span>Welcome!Welcome!
    1. Who Is This Book For?
    2. Nomenclature and Syntax
    3. Overview
    4. How to Read This Book
    5. Getting Help
    6. A Few Final Comments
  3. Part I. Language Basics
    1. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">1. </span>Installing SassInstalling Sass
    2. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">2. </span>Scoping Selectors with NestingScoping Selectors with Nesting
    3. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">3. </span>CommentingCommenting
    4. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">4. </span>Advanced ScopingAdvanced Scoping
    5. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">5. </span>CSS Output StylesCSS Output Styles
    6. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">6. </span>Importing FilesImporting Files
    7. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">7. </span>Defining VariablesDefining Variables
    8. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">8. </span>Keeping Code Clean with MixinsKeeping Code Clean with Mixins
  4. Part II. Simple Use Cases
    1. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">9. </span>Calculating a Simple LayoutCalculating a Simple Layout
    2. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">10. </span>Creating Themes with Advanced ColorsCreating Themes with Advanced Colors
    3. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">11. </span>Resetting CSSResetting CSS
    4. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">12. </span>Using Media QueriesUsing Media Queries
    5. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">13. </span>Organizing Your Style SheetsOrganizing Your Style Sheets
  5. Part III. Advanced Mixins
    1. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">14. </span>Adding Mixin ArgumentsAdding Mixin Arguments
    2. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">15. </span>Using More Mixin Argument TricksUsing More Mixin Argument Tricks
    3. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">16. </span>Controlling Flow with @ifControlling Flow with @if
    4. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">17. </span>Manipulating @contentManipulating @content
    5. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">18. </span>Using Mixins for Cross-Browser CompatibilityUsing Mixins for Cross-Browser Compatibility
  6. Part IV. Values in Sass
    1. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">19. </span>Understanding Value Types in SassUnderstanding Value Types in Sass
    2. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">20. </span>InterpolatingInterpolating
    3. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">21. </span>Using Lists to Work with Multiple PropertiesUsing Lists to Work with Multiple Properties
    4. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">22. </span>Looping Through ListsLooping Through Lists
    5. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">23. </span>Manipulating ListsManipulating Lists
    6. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">24. </span>Using Maps for More Detailed CollectionsUsing Maps for More Detailed Collections
    7. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">25. </span>Looping Through MapsLooping Through Maps
    8. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">26. </span>Manipulating MapsManipulating Maps
    9. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">27. </span>Using Maps for Namespace ConfigurationUsing Maps for Namespace Configuration
  7. Part V. Advanced Language Features
    1. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">28. </span>Creating Your Own FunctionsCreating Your Own Functions
    2. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">29. </span>Debugging Your SassDebugging Your Sass
    3. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">30. </span>Using &amp; to Implement BEMUsing & to Implement BEM
    4. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">31. </span>Using @extend as a Mixin AlternativeUsing @extend as a Mixin Alternative
    5. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">32. </span>Using Placeholders with @extendUsing Placeholders with @extend
    6. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">33. </span>Understanding the Dangers of @extendUnderstanding the Dangers of @extend
    7. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">34. </span>Escaping Indentation with @rootEscaping Indentation with @root
  8. Part VI. Libraries and Frameworks
    1. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">35. </span>Fully Featured FrameworksFully Featured Frameworks
    2. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">36. </span>Using Grid Systems for LayoutUsing Grid Systems for Layout
    3. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">37. </span>Introducing EyeglassIntroducing Eyeglass
    4. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">38. </span>Doing Math with EyeglassDoing Math with Eyeglass
    5. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">39. </span>Spriting with EyeglassSpriting with Eyeglass
  9. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">A1. </span>SassScript Function ReferenceSassScript Function Reference
  10. <span xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" class="toc-secnum">A2. </span>Introduction to HamlIntroduction to Haml
    1. Haml Walkthrough: ERB
    2. Haml Walkthrough: HTML