E-book details

Less Web Development Essentials. Use CSS preprocessing to streamline the development and maintenance of your web applications

Less Web Development Essentials. Use CSS preprocessing to streamline the development and maintenance of your web applications

Bass Jobsen

Ebook
Less is a CSS preprocessor that essentially improves the functionality of simple CSS with the addition of several features. The book begins by teaching you how Less facilitates the process of web development. You will quickly then move on to actually creating your first layout using Less and compiling your very first Less code.
Next, you will learn about variables and mixins and how they will help in building robust CSS code. In addition, you'll learn how to keep your code clean and test it by using style guides. We will then move on to the concept of Bootstrapping and the strength of using Less with Twitter Bootstrap. Going one step further, you will be able to customize Twitter's Bootstrap 3 using Less.
Finally, you will learn how to integrate Less into your WordPress themes and explore other web apps that use Less. By leveraging this powerful CSS preprocessor, you will be able to consistently produce amazing web applications while making CSS code development an enjoyable experience.
  • Less Web Development Essentials
    • Table of Contents
    • Less Web Development Essentials
    • Credits
    • Foreword
    • About the Author
    • Acknowledgments
    • About the Reviewers
    • www.PacktPub.com
      • Support files, eBooks, discount offers and more
        • Why Subscribe?
        • Free Access for Packt account holders
    • Preface
      • What this book covers
      • What you need for this book
      • Who this book is for
      • Conventions
      • Reader feedback
      • Customer support
        • Downloading the example code
        • Errata
        • Piracy
        • Questions
    • 1. Improving Web Development with Less
      • Using CSS3 for styling your HTML
        • Using CSS Selectors to style your HTML
        • Specificity, Inheritance, and Cascade in CSS
          • How CSS specificity works
        • Building your layouts with flexible boxes
      • Compiling Less
        • Getting started with Less
        • Using the watch function for automatic reloading
        • Debugging your code
          • Example code used in this book
      • Your first layout in Less
        • Vendor-specific rules
        • Build rounded corners with border-radius
      • Preventing cross-browser issues with CSS resets
        • Creating background gradients
      • CSS transitions, transformations, and animations
      • Box-sizing
      • Server-side compiling
        • Compressing and minimizing your CSS
        • Graphical user interfaces
      • Summary
    • 2. Using Variables and Mixins
      • Comments
        • Nested comments
        • Special comments
      • Variables
        • Organizing your files
        • Naming your variables
        • Using a variable
        • Organizing variables
        • The last declaration wins
        • Variable declaration is not static
        • Lazy loading
      • Escaping values
      • Mixins
        • Basic mixins
        • Parametric mixins
          • Default values
        • Naming and calling
        • Multiple parameters
        • More complex mixins for linear gradient backgrounds
        • Special variables @arguments and @rest
        • Return values
        • Changing the behavior of a mixin
          • Switches
          • Argument matching
          • Guarded mixins
          • Using guards and argument matching to construct loops
        • The !important keyword
      • Summary
    • 3. Nested Rules, Operations, and Built-in Functions
      • The navigation structure
      • Nested rules
        • Mixins and classes
        • Variables
        • Classes and namespaces
      • Operating on numbers, colors, and variables
      • The & symbol
      • Property merging
      • Built-in functions
        • JavaScript
        • List functions
        • Using color functions
        • The darken() and lighten() functions
        • Color manipulation
          • Color operations
        • Color blending with Less
        • Type functions
      • The box-shadow mixin
      • Summary
    • 4. Avoid Reinventing the Wheel
      • Revisiting background gradients
        • Unused code
          • Chromes developer tools
          • Firebug CSS usage add-on
      • Testing your code
        • Understanding TDD
        • All about style guides
          • Building a style guide with StyleDocco
          • Testing your code with tdcss.js
      • Prebuilt mixins
        • Using single-line declarations for vendor-specific rules with Less Elements
        • Less Hat a comprehensive library of mixins
        • Using the 3L library of prebuilt mixins
          • SEO and HTML debugging
        • ClearLess another library of prebuilt mixins
        • Using Preboot's prebuilt mixins for your project
      • Integrating other techniques into your projects using Less
        • Using iconic fonts
        • Retina.js
      • Summary
    • 5. Integrate Less in Your Own Projects
      • Importing CSS into Less
        • Using the @import rule
      • Migrating your project
        • Organizing your files
        • Converting CSS code to Less code
      • Media queries and responsive design
        • Making your layout fluid
          • Testing your layouts on a mobile phone
          • Coding first for mobile
      • Using grids in your designs and work flow
        • The role of CSS float in grids
          • Making your grid responsive
          • The role of the clearfix
        • Using a more semantic strategy
        • Building your layouts with grid classes
        • Building nested grids
        • Alternative grids
      • Building your project with a responsive grid
        • Using Preboot's grid system
      • Using the grid mixins to build a semantic layout
      • Extending your grids
        • Adding grid classes for the small grid
        • Applying the small grid on your semantic code
      • Summary
    • 6. Bootstrap 3, WordPress, and Other Applications
      • Bootstrap 3
        • Working with Bootstrap's Less files
          • Building a Bootstrap project with Grunt
          • Compiling your Less files
          • Dive into Bootstrap's Less files
          • Creating a custom button with Less
          • Customizing Bootstrap's navbar with Less
          • Bootstrap classes and mixins
          • Theming Bootstrap with Less
          • The a11y theme for Bootstrap
          • Color schemes with 1pxdeep
        • Using Bootstrap's customizer to build your own version
      • Semantic UI another Less framework
        • Automatic prefixing of vendor-specific rules
      • Other frameworks to build your grid with Less
        • Using the Golden Grid System to build your grids
        • The Semantic Grid System
      • WordPress and Less
        • Using the Roots theme with Less
        • JBST with a built-in Less compiler
        • The Semantic UI WordPress theme
        • WordPress plugins and Less
          • Theme WooCommerce with Less
          • The WP Less to CSS plugin
      • Alternative compilers for compiling your Less code
        • The Less.php compiler
        • The .less compiler for .NET apps
        • List of tools to develop Less
      • Summary
    • Index
  • Title: Less Web Development Essentials. Use CSS preprocessing to streamline the development and maintenance of your web applications
  • Author: Bass Jobsen
  • Original title: Less Web Development Essentials. Use CSS preprocessing to streamline the development and maintenance of your web applications
  • ISBN: 9781783981472, 9781783981472
  • Date of issue: 2014-04-24
  • Format: Ebook
  • Item ID: e_3b77
  • Publisher: Packt Publishing