Sass and Compass Designer's Cookbook

Packt Publishing Limited
  • 1. Auflage
  • |
  • erschienen am 29. April 2016
  • |
  • 436 Seiten
E-Book | ePUB mit Adobe DRM | Systemvoraussetzungen
978-1-78328-694-2 (ISBN)
Over 120 practical and easy-to-understand recipes that explain how to use Sass and Compass to write efficient, maintainable, and reusable CSS code for your web development projectsAbout This BookLeverage Sass to make your CSS code maintainable, reusable and prevent code duplicationsShorten debug time with Sass when creating complex CSS code for different browsers and devicesWrite easy and bullet-proof CSS with Compass using this step-by-step and detailed guideWho This Book Is ForThis book is mainly intended for web developers and designers who are comfortable with CSS and HTML. If you are someone with some experience with CSS, you will find the learning curve of learning Sass syntax to be less steep. Basic knowledge of web development is helpful but you don't have to be a programmer to understand Sass.What You Will LearnSpend less time debugging codeCompile Sass code into readable and maintainable CSSIntegrate Sass in your own projectsReuse your code to prevent code duplicationsWrite reusable and portable CSS codeMake use of pre-built and established code written by other developersReduce development and maintenance time of your projectsSet up a development environment with GulpIn DetailSass and Compass Designer's Cookbook helps you to get most out of CSS3 and harness its benefits to create engaging and receptive applications. This book will help you develop faster and reduce the maintenance time for your web development projects by using Sass and Compass. You will learn how to use with CSS frameworks such as Bootstrap and Foundation and understand how to use other libraries of pre-built mixins. You will also learn setting up a development environment with Gulp.This book guides you through all the concepts and gives you practical examples for full understanding.Style and approachThis book is the perfect mix of essential theory combined with real-life examples and problems, with clear explanations of the more sophisticated Sass concepts. Learn Sass and Compass with practical and well-explained example code. This book follows a problem and solution approach that is convenient to understand and follow.
  • Englisch
  • Birmingham
  • |
  • Großbritannien
978-1-78328-694-2 (9781783286942)
1783286946 (1783286946)
weitere Ausgaben werden ermittelt
Bass Jobsen has been programming for the Web since 1995, covering everything from C to PHP and is always on the hunt to find the most accessible interfaces. He is based in Orthen, the Netherlands.
Bass uses Sass in his daily job for web designing tasks and WordPress theme development.
He can be contacted via and he writes a blog that you can find at
Also, check his Bootstrap WordPress Starters Themes (JBST) and other projects at GitHub:
Information on his current projects and development is available at, and
  • Cover
  • Copyright
  • Credits
  • About the Author
  • About the Reviewers
  • Table of Contents
  • Preface
  • What you need for this book
  • Chapter 1: Getting Started with Sass
  • Introduction
  • Installing Sass for command line usage
  • Installing Compass
  • Using Sass on the command line
  • Using the Sass interactive mode and SassScript
  • Using the sass-gulp plugin with Gulp
  • Using Sass in the browsers
  • Writing Sass or SCSS
  • Choosing your output style
  • Working with partials
  • Writing your code in a text editor
  • Chapter 2: Debugging Your Code
  • Introduction
  • Using CSS source maps to debug your code
  • Editing and debugging your Sass code in a browser
  • Commenting your code in the SCSS syntax
  • Building style guides with tdcss.js
  • Building style guides with the Kalei Styleguide
  • Using the @debug, @warn, and @error directives
  • Playing on SassMeister
  • Chapter 3: Variables, Mixins, and Functions
  • Introduction
  • Using variables
  • Applying operations in Sass
  • Declaring variables with !default
  • Interpolation of variables
  • Leveraging mixins
  • Writing mixins with arguments
  • Duplicating mixins and name collisions
  • Creating pure Sass functions
  • Chapter 4: Nested Selectors and Modular CSS
  • Introduction
  • Using nested selectors
  • Creating more intuitive code and making inheritance clear
  • Referencing parent selectors with the & sign
  • Using multiple & signs to refer to the parent selector more than once
  • Using the & operator to change the selector order
  • Utilizing the @extend directive
  • Using placeholder selectors with the @extend directive
  • Using the @extend directive together with the @media at-rule
  • Using the @extend directive with care
  • Emitting rules at the root of the document
  • Avoiding nested selectors too deeply for more modular CSS
  • Applying the OOCSS, SMACSS, and BEM methodologies
  • Chapter 5: Built-in Functions
  • Introduction
  • Color functions
  • String functions
  • Number functions
  • List functions
  • Map functions
  • Selector functions
  • Introspection functions
  • Conditional assignments
  • Adding custom functions to Sass
  • Chapter 6: Using Compass
  • Introduction
  • Extending Sass with Compass helper functions
  • Truncating Text with ellipses
  • Tuning Vendor Prefixes from Compass Stylesheets
  • Adding Compass to an existing Sass project
  • Maintaining your applications with Compass
  • Using Bootstrap with Compass
  • Chapter 7: Cross-Browser CSS3 Mixins
  • Introduction
  • Browser support
  • Using vendor prefixes
  • Cross browser CSS3 with Compass
  • The Can I Use database
  • Applying progressive enhancement
  • The -prefix-free library
  • Mobile first strategies
  • Chapter 8: Advanced Sass Coding
  • Introduction
  • Using @if
  • Using @for
  • Using @each
  • Loops with @while
  • Creating a vertical rhythm for your website
  • Creating color contrasts automatically
  • Using icon fonts
  • Image sprites with Compass
  • Media queries with Breakpoint
  • Chapter 9: Building Layouts with Sass
  • Introduction
  • Using a CSS reset
  • Importing and organizing your files
  • Building a grid with grid classes
  • Creating responsive grids
  • Building a semantic grid with mixins
  • Applying the grid on your design
  • Integrating a vertical navigation menu in your layout
  • Creating grids with
  • Using Compass Layout Module
  • Chapter 10: Building Grid-based Layouts with Susy and Sass
  • Introduction
  • Installing and configuring Susy
  • Defining containers and columns
  • Mobile first and responsive grids
  • Preventing subpixel rounding errors
  • Generating asymmetric layouts
  • Chapter 11: Foundation and Sass
  • Introduction
  • Installing Foundation CLI
  • Integrating Foundation in a Compass project
  • Creating semantic grids with Foundation
  • Building off-canvas menus with Sass and JavaScript
  • Using Foundation 6 with WordPress and Sass
  • Chapter 12: Bootstrap and Sass
  • Introduction
  • Downloading and installing Bootstrap
  • Customizing Bootstrap with variables
  • Configuring Bootstrap using variables
  • Making custom buttons
  • Making custom cards
  • Making custom navbars
  • Extending components using @extend
  • Using Bootstrap Mixins and Classes
  • Extending the Mixins with Your Own Mixins
  • Implementing semantic layouts with Bootstrap
  • Using WordPress with Bootstrap and Sass
  • Chapter 13: Meeting the Bourbon Family
  • Introduction
  • Bourbon mixins for prefixing
  • Creating visual triangles
  • Using modular scales for typefacing
  • Semantic grids with Neat
  • Creating buttons with Bitters
  • Using the page navigation component from Refills
  • Chapter 14: Ruby on Rails and Sass
  • Introduction
  • Hello world with Ruby on Rails
  • Explaining the main.css.scss file
  • Adding Compass to your Ruby on Rails setup
  • Using Susy with Ruby on Rails
  • Using Bourbon inside Rails
  • Integrating Bootstrap
  • Creating a RoR app with Foundation 6
  • Chapter 15: Building Mobile Apps
  • Introduction
  • Installing the Ionic framework
  • Starting a new Ionic project using Sass
  • Customizing the buttons of your Ionic project
  • Setting up a Foundation App project
  • Using mixins to customize your Foundation App project
  • Chapter 16: Setting up a Build Chain with Grunt
  • Introduction
  • Installing Grunt
  • Installing Grunt plugins
  • Utilizing the Gruntfile.js file
  • Adding a configuration definition for a plugin
  • Adding the Sass compiler task
  • Integrating Compass in the build chain
  • Installing Bourbon in the build chain
  • Automatically prefixing your code with Grunt
  • Getting Grunt watch for sass, and LiveReload to work
  • Utilizing Yeoman
  • Index

Dateiformat: EPUB
Kopierschutz: Adobe-DRM (Digital Rights Management)


Computer (Windows; MacOS X; Linux): Installieren Sie bereits vor dem Download die kostenlose Software Adobe Digital Editions (siehe E-Book Hilfe).

Tablet/Smartphone (Android; iOS): Installieren Sie bereits vor dem Download die kostenlose App Adobe Digital Editions (siehe E-Book Hilfe).

E-Book-Reader: Bookeen, Kobo, Pocketbook, Sony, Tolino u.v.a.m. (nicht Kindle)

Das Dateiformat EPUB ist sehr gut für Romane und Sachbücher geeignet - also für "fließenden" Text ohne komplexes Layout. Bei E-Readern oder Smartphones passt sich der Zeilen- und Seitenumbruch automatisch den kleinen Displays an. Mit Adobe-DRM wird hier ein "harter" Kopierschutz verwendet. Wenn die notwendigen Voraussetzungen nicht vorliegen, können Sie das E-Book leider nicht öffnen. Daher müssen Sie bereits vor dem Download Ihre Lese-Hardware vorbereiten.

Weitere Informationen finden Sie in unserer E-Book Hilfe.

Download (sofort verfügbar)

40,53 €
inkl. 19% MwSt.
Download / Einzel-Lizenz
ePUB mit Adobe DRM
siehe Systemvoraussetzungen
E-Book bestellen

Unsere Web-Seiten verwenden Cookies. Mit der Nutzung dieser Web-Seiten erklären Sie sich damit einverstanden. Mehr Informationen finden Sie in unserem Datenschutzhinweis. Ok