Advertisement
HTML & CSS

Mastering Sass: Lesson 2

by

In lesson one of our quick tip series, we learned how to install Sass, and how to use variables, nesting, and compression in our stylesheets. Today, we'll review mixins and selector inheritance, which can provide us with a great deal of convenience and flexibility!

Related Posts
  • Web Design
    eCommerce
    An Overview of My Shopify Workflow ToolsShopify thumb
    Following the publication of the recent Shopify Theme Series I have had a few people get in touch and ask me about some of the workflow tools I use when building themes. Let's look at just a few of them.Read More…
  • Web Design
    HTML & CSS
    An Introduction to Error Handling in SassSass error
    I don't know about you, but I really don't like letting the Sass compiler fail. In this tutorial we'll introduce the concept of handling Sass errors properly.Read More…
  • Web Design
    HTML/CSS
    Why I Choose Stylus (And You Should Too)Stylus thumb
    The world of front end web development has been steadily increasing its uptake of what we call "CSS Preprocessors", which extend the functionality of regular CSS. Arguably the two most well known, with the greatest user base, are LESS and Sass/SCSS. However there is a third preprocessor that hasn't received quite as much attention, and that's Stylus.Read More…
  • Code
    Creative Coding
    Adding Custom UI Themes to Wordpress Admin Using SassPreview image@2x
    With the release of WordPress 3.8 we now have a new feature for Admin UI themes. This means that every user can change the color scheme of his admin regardless of the the theme that’s being used on the front-end. To change the color scheme of your admin, go to Users > Your Profile. Here you’ll see eight predefined themes that you can select from. Select any theme from these themes and you’ll see the changes immediately. When you are done with selecting the theme, hit the “Update Profile” button.Read More…
  • Web Design
    Applications and Tools
    Building Semantic Grids With GumbyGumby semantic retina
    In this tutorial we're going to build ourselves clean, readable markup with the help of Gumby's semantic grid structure. We'll continue working with the example we started in the previous lesson, getting rid of as much unnecessary mess from our code as possible, plus we'll be using Sass to speed things up.Read More…
  • Web Design
    HTML/CSS
    Foundation's Sassy Styles ExplainedFoundation sass retina1
    In this tutorial we'll cover what can be done with the flexible Sass styles included in the Foundation framework. A lot of these offer a more customisable feature set than that of the CSS version, plus there are shortcuts which can be used to style items such as the top bar quickly and easily.Read More…