Take 50% off our developer subscriptions with the coupon "nifty50" Custom Web Development Services

Support Forum

  • Page:
  • 1

LESS variables

zentoolsIf you use Zentools please post a review at the Joomla! Extensions Directory.

Variables can be be added once and then reused throughout the LESS and when compiled will output as the CSS values

LESS Variables are defined with an @ character
Can be different kinds of data types - these are colour, string, boolean and multi-value

Example variables

@mainColour1: navy; // named color value
@mainColour2: #000080; // hex color value
@myTeststring: " adding text"; // string variable
@paraFontsize: 1em; // numeric value
@skinnyBorder: 4px solid @mainColour1; // multi-value variable
@standardPaddingVar: 5px 10px 15px 5px; // multi-value variable



h1, h2 {
color: @mainColour2;
}

#mypara {
font-size: @paraFontsize;
border: @skinnyBorder;
padding: @standardPaddingVar;
}

Variables can be a real time saver.
  • paulus103's Avatar
  • paulus103
  • Moderator
  • 44937 posts
  • 2065 Thanks
  • Karma: 603
The administrator has disabled public write access.

zentoolsIf you use Zentools please post a review at the Joomla! Extensions Directory.

Happy Campers