19,19 €
Mehr erfahren.
- Herausgeber: Packt Publishing
- Kategorie: Wissenschaft und neue Technologien
- Sprache: Englisch
CSS styling has been a key part of developing for the Internet since the early 1990s, but unlike JavaScript, has suffered from the inability to produce dynamic styles, using functions, operators, and variables. SASS uses the power of Ruby to bring support for all three and more to your CSS, allowing you to engage in a more efficient, modular style of working, and making it easier to maintain your CSS styling in your projects.Instant SASS CSS How-to is a practical, hands-on guide that provides you with a number of clear step-by-step exercises, which will help you take advantage of the power of SASS, and give you a good grounding in writing and compiling CSS style sheets using the SASS pre-processor language.This book looks at how you can incorporate SASS into your web pages, and either produce style sheets dynamically, or pre-compile them before including the final article into your site's pages.You will also learn how you can use the power of mixins, functions, and variables to help produce style sheets, and reduce the amount of code you need to write in your style sheets. We will also take a look at how you can incorporate a more modular style to your development workflow, which will help with making style sheets more manageable and easier to update in the future. We will also take a look at how you can build up libraries of reusable code that you can incorporate into your future projects.You will learn everything you need to know to start using SASS to help produce more efficient style sheets in your site's pages, and adopt a more modular development workflow, which will make it easier to maintain your sites in the future.
Das E-Book können Sie in Legimi-Apps oder einer beliebigen App lesen, die das folgende Format unterstützen:
Seitenzahl: 94
Veröffentlichungsjahr: 2013
Ähnliche
Table of Contents
Instant SASS CSS How-to
Instant SASS CSS How-to
Copyright © 2013 Packt Publishing
All rights reserved. No part of this book may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written permission of the publisher, except in the case of brief quotations embedded in critical articles or reviews.
Every effort has been made in the preparation of this book to ensure the accuracy of the information presented. However, the information contained in this book is sold without warranty, either express or implied. Neither the author, nor Packt Publishing, and its dealers and distributors will be held liable for any damages caused or alleged to be caused directly or indirectly by this book.
Packt Publishing has endeavored to provide trademark information about all of the companies and products mentioned in this book by the appropriate use of capitals. However, Packt Publishing cannot guarantee the accuracy of this information.
First published: February 2013
Production Reference: 1180213
Published by Packt Publishing Ltd.
Livery Place
35 Livery Street
Birmingham B3 2PB, UK.
ISBN 978-1-78216-378-7
www.packtpub.com
Credits
Author
Alex Libby
Reviewer
Melanie Archer
Acquisition Editor
Kartikey Pandey
Commissioning Editor
Maria D'souza
Technical Editor
Veronica Fernandes
Project Coordinator
Esha Thakker
Proofreader
Lindsey Thomas
Production Coordinator
Melwyn D'sa
Cover Work
Melwyn D'sa
Cover Image
Sheetal Aute
About the Author
Alex Libby has background in IT support – he has been involved in supporting end users for the last 15 years in a variety of different environments, and currently works as a technical analyst, supporting a medium-sized SharePoint estate for an international parts distributor based in the UK. Although he gets to play with different technologies in his day job, his first true love has always been with the open source movement, and in particular experimenting with CSS/CSS3 and HTML5. To date, Alex has written two books (one on HTML5 video and another on JQuery tools) – Instant SASS CSS How-to is his third book.
I'd like to thank my family and friends for their help and encouragement, Maria D'souza for her help and guidance in writing the book, and Melanie for providing lots of constructive comments with the reviewing – without them, I am sure I wouldn't have been able to produce this book!
About the Reviewer
Melanie Archer is a web developer living in Oakland, California, USA. Since hand-coding her first web page in 1997, she's worked with many corporations, design agencies, and startups to bring standards-compliant delight to dozens of user interfaces. Other titles she has reviewed include HTML5 Boilerplate Web Development,Divya Manian, Packt Publishing.
You can follow Melanie on Twitter at @mejarc.
www.PacktPub.com
Support files, eBooks, discount offers and more
You might want to visit www.PacktPub.com for support files and downloads related to your book.
Did you know that Packt offers eBook versions of every book published, with PDF and ePub files available? You can upgrade to the eBook version at www.PacktPub.com and as a print book customer, you are entitled to a discount on the eBook copy. Get in touch with us at <[email protected]> for more details.
At www.PacktPub.com, you can also read a collection of free technical articles, sign up for a range of free newsletters and receive exclusive discounts and offers on Packt books and eBooks.
http://PacktLib.PacktPub.com
Do you need instant solutions to your IT questions? PacktLib is Packt's online digital book library. Here, you can access, read and search across Packt's entire library of books.
Why Subscribe?
Free Access for Packt account holders
If you have an account with Packt at www.PacktPub.com, you can use this to access PacktLib today and view nine entirely free books. Simply use your login credentials for immediate access.
Preface
Imagine the following scenario:
You're an accomplished developer, working on a high profile project for a demanding client. You're normally a fairly patient kind of person, but even this client is proving a little bit too much of a challenge…when you get that phone call you dread.
"Alex…you know those buttons you kindly changed for me last week? I'm really sorry, but could we please try a different color, as the boss really doesn't like that shade of red!"
This is where you silently curse – that's more than 60 buttons, littered with browser-specific CSS prefixes; a real pain in the neck, which you could well do without, particularly as it took you a couple of hours to make the changes last time. (Yes, it's a big site, before you ask!). Sounds familiar? Wish there was another way to do this? I thought so – welcome to the world of SASS!
SASS, I hear you ask? What's this all about then? Well, I could give you the technical low-down, but it's probably better demonstrated by the use of an example. Do you remember those 60 buttons I mentioned earlier? What if you could change the color of all of those buttons in one go? Yes, you read right, all of those buttons. This is just a small part of what SASS can achieve, as a superset of CSS3. We can use the power of SASS to set a variable that you could use to change the color value set against all buttons in one go, with a single click.
Intrigued? We will look at this and more throughout this book, so let's make a start…
What this book covers
Throughout this book, we're going to look at a variety of exercises that are designed to help you become accustomed to working with the basics of the LESS CSS preprocessor language. You're probably wondering what we're going to cover, right? No problem – let me reveal all:
Downloading and installing SASS (Must know) is the most important part of this book – here, we take a look at how to download and install SASS. Depending on which platform you prefer to use, it can be really easy, or somewhat more involved.
Adding support to text editors (Must know) will take you through how to add support for SASS to your favorite text editor. In this recipe, we'll use Sublime Text 2 as our editor, but the principles could equally apply to other editors that you may prefer to use.
Pre-compiling SASS (Must know) will show you that you don't always have to rely on the command line to compile SASS; there are alternatives available that can do the heavy work for you. In this recipe, I'll show you how, using Scout. We'll also look at a means to convert CSS back to SCSS, although it is not without its shortcomings
Viewing SASS in a browser (Become an expert) is crucial to help debug any style issues in your code. There will be moments when you've written a style, only to find it's not working as you expected. No problem – I'll show you some ways to view this information, depending on which browser you prefer to use.
Using nested rules (Must know) in SASS is a good way to reduce repetition in your code. In this recipe, we'll start our coding journey by looking at how you can use SASS to nest your CSS rules, to avoid such repetition.
Using comments in SASS (Should know) will probably be one of the most important things you use in SASS when starting out. After all we're only human, and you won't be able to remember what each style is meant to do, once you complete your project! In this recipe we'll see how to add comments in this task, and when to use the different types available.
Getting interactive with Script (Become an expert) may at first appear easy, but it's simplicity belies its true power. In this recipe, you'll learn how you can easily check the results of any mathematical formula you decide to use in writing SASS. Not sure what I mean? Here's why you'll see margin-left: 5px + 8px/2px equals 9px, and not 6.5px, as you might otherwise expect.
Using CSS-3 directives in SASS (Must know) will be a lifesaver, particularly for anyone who uses responsive design techniques. You are very likely to have used keywords such as @media or @import in your code, but have you nested your CSS-3 directives before? In this recipe, I'll show you how you can achieve this and more, using SASS.
Controlling output in SASS (Must know) will show you how you can really save time when working with lots of repeating styles. In this recipe, you'll see how you can use the power of SASS to dynamically create styles for multiple items that use the same styles, such as a group of social media buttons.
Creating and using mixins (Must know)
