Meta tags:
description=Less extends CSS with dynamic behavior such as variables, mixins, operations and functions. Less runs on both the server-side (with Node.js and Rhino) or client-side (modern browsers only). ;
author=The Core Less Team;

Headings (most frequently used words):

mixins, scope, extend, variables, the, variable, mixin, caller, selectors, plugin, to, deprecated, import, properties, detached, css, with, in, functions, selector, ruleset, lookups, access, overview, at, rules, guards, namespaces, matching, using, as, scoping, property, accessors, features, less, interpolation, multiple, reference, inside, use, advanced, arguments, and, values, unlocking, guard, operators, modify, has, from, parent, merge, rulesets, maps, file, extensions, options, parentheses, guarded, important, keyword, parametric, pattern, recursive, aliasing, tips, tricks, writing, your, first, null, js, object, pre, loaded, plugins, lazy, evaluation, new, default, changing, order, combinatorial, explosion, inline, once, optional, syntax, attached, extending, nested, exact, nth, expression, all, media, duplication, detection, cases, for, comma, space, urls, statements, example, classic, case, reducing, size, combining, styles, more, parameter, separators, overloading, named, parameters, rest, value, overriding, unnamed, into, comparison, logical, type, checking, calls, definition, visibility, referencing, won, will, lookup, have,

Text of the page (most frequently used words):
the (281), color (195), mixin (168), extend (108), less (104), and (99), you (97), can (90), variable (88), selector (84), this (72), #mixins (70), #ruleset (69), for (66), value (62), blue (59), use (57), not (57), with (55), background (54), will (52), import (51), when (49), variables (48), scope (47), detached (47), media (46), class (46), css (44), example (42), that (41), are (39), plugin (39), width (38), selectors (37), one (36), file (34), output (32), foo (32), prop (31), block (30), functions (29), inline (28), inside (28), into (28), red (28), function (27), only (27), library (27), caller (27), outputs (27), all (27), height (26), same (26), arguments (26), hover (26), pre (25), properties (25), have (25), border (25), box (25), want (24), but (24), from (24), used (23), your (22), which (22), colors (22), black (22), parent (22), radius (22), call (21), also (21), values (21), two (21), rule (21), nested (21), link (21), other (20), name (20), match (20), source (19), using (19), some (19), rules (19), any (19), multiple (19), green (19), reference (19), released (18), white (18), bucket (18), property (17), edit (17), markdown (17), button (17), lookup (17), padding (17), note (16), definition (16), guards (16), compiles (16), div (16), margin (16), may (15), rulesets (15), list (15), deprecated (15), does (15), wrap (15), return (14), like (14), var (14), true (14), primary (14), keyword (14), default (14), here (13), imported (13), would (13), space (13), because (13), syntax (13), was (13), defined (12), another (12), dark (12), header (12), top (12), matches (12), called (11), more (11), what (11), features (11), optional (11), behavior (11), display (11), declaration (11), its (11), results (11), following (11), comma (11), shadow (11), styles (11), after (10), once (10), has (10), add (10), them (10), guard (10), maps (10), important (10), navbar (10), above (10), identifier (10), plugins (9), there (9), each (9), being (9), extension (9), test (9), three (9), calls (9), screen (9), size (9), parameters (9), separated (9), widget (9), title (9), nth (9), url (9), png (9), grand (9), code (8), see (8), instance (8), options (8), just (8), get (8), new (8), without (8), now (8), similar (8), files (8), style (8), 20px (8), access (8), config (8), min (8), parentheses (8), include (8), 1px (8), statements (8), 5px (8), matter (8), image (8), evaluated (7), first (7), error (7), type (7), 10px (7), 200px (7), define (7), treat (7), merge (7), way (7), accessors (7), where (7), contains (7), alias (7), matching (7), last (7), matched (7), inner (7), extends (7), font (7), nav (7), overview (7), currently (6), works (6), before (6), install (6), set (6), contain (6), don (6), such (6), case (6), meaning (6), both (6), scoping (6), however (6), text (6), statement (6), 50px (6), generate (6), counter (6), key (6), assigned (6), secondary (6), referenced (6), ignored (6), body (6), useful (6), than (6), loop (6), namespace (6), outer (6), result (6), single (6), 2px (6), moz (6), parameter (6), base (6), namespaces (6), animal (6), bear (6), alert (6), attached (6), lazy (6), issues (5), these (5), well (5), different (5), pluginmanager (5), later (5), object (5), could (5), need (5), node (5), level (5), make (5), number (5), were (5), let (5), put (5), option (5), then (5), left (5), line (5), override (5), returns (5), overridden (5), itself (5), lookups (5), second (5), desktop (5), light (5), place (5), unlock (5), scopes (5), passed (5), html (5), argument (5), based (5), 100 (5), column (5), 40px (5), switch (5), big (5), they (5), order (5), parametric (5), extended (5), child (5), visited (5), pseudo (5), menu (5), borderradius (5), current (5), custom (5), docs (4), how (4), most (4), times (4), might (4), github (4), adding (4), anything (4), eval (4), val (4), something (4), false (4), their (4), means (4), private (4), bar (4), say (4), available (4), show (4), math (4), write (4), browser (4), simple (4), pattern (4), feature (4), apply (4), directly (4), element (4), rest (4), global (4), preferred (4), merged (4), pass (4), visible (4), removed (4), thing (4), namespacing (4), aliasing (4), grey (4), returned (4), importer (4), declared (4), take (4), query (4), semi (4), colon (4), copied (4), valid (4), solid (4), operators (4), equivalent (4), 555 (4), class2 (4), class1 (4), possible (4), instead (4), expressions (4), recursive (4), classes (4), callers (4), average (4), allows (4), exactly (4), 000 (4), webkit (4), names (4), param1 (4), examples (4), word (4), 900 (4), transform (4), myclass (4), thing2 (4), thing1 (4), duplication (4), 1023px (4), extending (4), interpolated (4), interpolation (4), replacement (4), doublequote (4), singlequote (4), noquote (4), looks (4), allowed (4), images (4), cyan (4), cancel (4), themes (4), usage (4), depth (4), language (3), documentation (3), under (3), section (3), loaded (3), https (3), com (3), urls (3), string (3), evaluation (3), immediately (3), retrieve (3), collection (3), store (3), part (3), lib1 (3), placing (3), produce (3), dimension (3), start (3), writing (3), module (3), work (3), within (3), combining (3), auto (3), original (3), 100px (3), undefined (3), doing (3), approach (3), unlike (3), typical (3), future (3), notice (3), append (3), mobile (3), selected (3), unlocked (3), unlocking (3), modify (3), gain (3), accessible (3), those (3), root (3), old (3), either (3), non (3), declarations (3), else (3), isnumber (3), operator (3), considered (3), truth (3), guarded (3), columns (3), create (3), dosomething (3), too (3), inherited (3), final (3), specify (3), allow (3), expected (3), darken (3), sometimes (3), 008000 (3), quote (3), commas (3), support (3), mix (3), f5f5f5 (3), mode (3), between (3), generated (3), info (3), detection (3), toplevel (3), ignores (3), screenclass (3), nothing (3), target (3), found (3), essentially (3), expression (3), form (3), elements (3), exact (3), every (3), must (3), below (3), gets (3), importing (3), external (3), extensions (3), treated (3), efefef (3), control (3), 428bca (3), guide (3), post (2), types (2), context (2), collections (2), tree (2), push (2), null (2), had (2), authors (2), lib2 (2), choose (2), third (2), named (2), added (2), conflicts (2), namely (2), operations (2), unit (2), otherwise (2), stylesheet (2), fine (2), written (2), require (2), exports (2), achieve (2), group (2), declaring (2), calling (2), around (2), module__another (2), module__element (2), defining (2), tips (2), tricks (2), intuitive (2), looking (2), languages (2), ice (2), cream (2), lunch (2), dessert (2), foods (2), whether (2), replace (2), entire (2), individual (2), emulate (2), produces (2), easier (2), little (2), ability (2), 768px (2), tablet (2), sizes (2), darkblue (2), option1 (2), starting (2), select (2), time (2), throws (2), copying (2), referencing (2), over (2), via (2), lastly (2), cannot (2), orientation (2), portrait (2), full (2), ie9 (2), 1200px (2), piece (2), supported (2), mandatory (2), followed (2), assign (2), evaluate (2), aliased (2), theme (2), specific (2), iscolor (2), basic (2), checking (2), combine (2), logical (2), queries (2), max (2), definitions (2), comparison (2), usable (2), additionally (2), making (2), ddd (2), run (2), lightness (2), arity (2), already (2), iteration (2), combined (2), various (2), loops (2), definedonlyinmixin (2), protected (2), exception (2), 33px (2), 16px (2), look (2), cascade (2), 888 (2), behave (2), differently (2), change (2), bound (2), advanced (2), special (2), efca44 (2), 33acfe (2), ways (2), param (2), semicolon (2), containing (2), escape (2), separators (2), break (2), mixed (2), unimportant (2), huge (2), required (2), existing (2), avoid (2), flag (2), 15deg (2), rotate (2), scale (2), inset (2), brown (2), classic (2), cases (2), everything (2), print (2), sheet (2), compile (2), able (2), orange (2), attribute (2), leading (2), star (2), uses (2), recognized (2), compiled (2), placed (2), bag (2), instances (2), compiling (2), regardless (2), compatible (2), known (2), places (2), modifying (2), process (2), pull (2), bootstrap (2), marked (2), appear (2), normal (2), depending (2), imports (2), unless (2), been (2), php (2), dotted (2), 366 (2), combinatorial (2), explosion (2), prepend (2), putting (2), changing (2), ish (2), represents (2), commonly (2), easily (2), brass (2), 999 (2), 0ee (2), tidal (2), wave (2), bold (2), weight (2), banner (2), fff (2), location (2), repo (2), changelog, compiler, mit, license, maintained, core, team, while, scenarios, load, parsing, starts, manager, npm, visitor, processor, clean, repos, showing, provides, methods, visitors, managers, processors, printusage, lessc, explain, terminal, minversion, minimum, compatibility, array, argumentstring, setoptions, passes, arbitrary, args, parsed, almost, lifecycle, should, export, imma, storing, longer, strings, numbers, latter, converted, anonymous, nodes, throw, assignment, kind, sharing, effectively, particular, cause, creates, party, libraries, adheres, great, functionality, introducing, naming, noticed, globals, registry, convenience, units, api, correct, proper, wanted, multiply, against, plain, purposes, 141592653589793, congratulations, etc, lot, basics, focus, commonjs, conventions, keep, mind, cross, platform, shimmed, registerplugin, since, quite, automatically, appends, javascript, actual, allowing, applied, syntactic, sugar, 25px, align, created, nest, wrong, vars, trick, keeping, preventing, leaking, credit, 1472, similarly, pushed, introduction, differs, higher, locally, obvious, produced, releases, intuitively, additional, far, rulset, pairs, appropriate, versatile, overload, 1024px, 320px, turn, lightblue, option2, gains, renaming, won, win, needed, sees, visibility, said, takes, precedence, unlocks, even, advantage, bubbling, defines, abstracts, out, wrapping, content, except, declare, stored, structure, going, ambiguous, always, purple, map, assigning, isunit, isem, ispercentage, ispixel, check, addition, isurl, iskeyword, isstring, negate, conditions, separating, compare, falsy, truthy, introduces, sequence, trying, stay, close, declarative, nature, opted, implement, conditional, execution, vein, specifications, opposed, familiar, functional, programming, probably, encountered, generic, grid, 30px, launch, next, iterative, structures, creating, finally, acts, globaly, protection, includes, present, local, cascading, averaging, unnamed, customize, overriding, selecting, faded, fade, bind, equal, didn, happened, lightened, darker, a2a2a2, lighten, furthermore, blur, deal, supply, positions, legal, overloading, dummy, trailing, seems, strange, prefer, paren, necessary, originally, passing, hide, invoke, 6px, 4px, mark, sp_2, sp_1, assumed, never, guaranteed, condition, reduces, user, organize, groups, legacy, whitespace, complicated, stack, ids, historically, release, unintentional, joins, requires, explicit, join, pending, aggregating, alternative, blocks, relate, areas, copy, lead, unnecessary, therefore, move, wish, leads, reducing, simplified, subtype, overrides, firstly, including, ignore, think, operation, destructive, search, tells, replaced, treats, nostar, quotes, knows, shortcut, division, odd, ordinary, clauses, end, optionally, still, affect, onto, kept, isn, wherever, appears, merges, ones, references, exists, fileerror, stops, main, opposite, subsequent, regular, although, supports, standards, comments, hacks, related, targeted, implicit, pulled, position, method, imagine, marks, per, separate, keywords, continue, implemented, filename, offers, several, provide, flexibility, appended, included, standard, precede, doesn, care, sheets, expands, combinations, specified, permutation, done, modernizr, parentish, nearest, ancestor, linkish, makes, repeatedly, refer, repeating, variety, basically, repetitive, descendant, hovered, tags, typically, applying, loading, requests, afterwards, lighter, processing, very, much, twice, searching, upwards, determine, snippet, src, sand, 444, img, focused, sea, maintain, giving, uncommon, repeated, dozens, across, stylesheets, hundreds, installing, setting, environment, developing, quick, summary, about, tools, toggle, navigation,

Text of the page (random words):
1 param values name param1 red blue name param1 red blue overloading mixins it is legal to define multiple mixins with the same name and number of parameters less will use properties of all that can apply if you used the mixin with one parameter e g mixin green then properties of all mixins with exactly one mandatory parameter will be used mixin color color 1 color mixin color padding 2 color 2 color padding 2 padding mixin color padding margin 2 color 3 color padding 3 padding margin margin margin margin margin some selector div mixin 008000 compiles into some selector div color 1 008000 color 2 008000 padding 2 2 named parameters a mixin reference can supply parameters values by their names instead of just positions any parameter can be referenced by its name and they do not have to be in any special order mixin color black margin 10px padding 20px color color margin margin padding padding class1 mixin margin 20px color 33acfe class2 mixin efca44 padding 40px compiles into class1 color 33acfe margin 20px padding 20px class2 color efca44 margin 10px padding 40px the arguments variable arguments has a special meaning inside mixins it contains all the arguments passed when the mixin was called this is useful if you don t want to deal with individual parameters box shadow x 0 y 0 blur 1px color 000 webkit box shadow arguments moz box shadow arguments box shadow arguments big block box shadow 2px 5px which results in big block webkit box shadow 2px 5px 1px 000 moz box shadow 2px 5px 1px 000 box shadow 2px 5px 1px 000 advanced arguments and the rest variable you can use if you want your mixin to take a variable number of arguments using this after a variable name will assign those arguments to the variable mixin matches 0 n arguments mixin matches exactly 0 arguments mixin a 1 matches 0 1 arguments mixin a 1 matches 0 n arguments mixin a matches 1 n arguments furthermore mixin a rest rest is bound to arguments after a arguments is bound to all arguments pattern matching sometimes you may want to change the behavior of a mixin based on the parameters you pass to it let s start with something basic mixin s color class mixin switch 888 now let s say we want mixin to behave differently based on the value of switch we could define mixin as such mixin dark color color darken color 10 mixin light color color lighten color 10 mixin _ color display block now if we run switch light class mixin switch 888 we will get the following css class color a2a2a2 display block where the color passed to mixin was lightened if the value of switch was dark the result would be a darker color here s what happened the first mixin definition didn t match because it expected dark as the first argument the second mixin definition matched because it expected light the third mixin definition matched because it expected any value only mixin definitions which matched were used variables match and bind to any value anything other than a variable matches only with a value equal to itself we can also match on arity here s an example mixin a color a mixin a b color fade a b now if we call mixin with a single argument we will get the output of the first definition but if we call it with two arguments we will get the second definition namely a faded to b using mixins as functions edit the markdown source for mixins as functions selecting properties and variables from mixin calls property value accessors released v3 5 0 starting in less 3 5 you can use property variable accessors to select a value from an evaluated mixin s rules this can allow you to use mixins similar to functions example average x y result x y 2 div call a mixin and look up its result value padding average 16px 50px result results in div padding 33px overriding mixin values if you have multiple matching mixins all rules are evaluated and merged and the last matching value with that identifier is returned this is similar to the cascade in css and it allows you to override mixin values library less library mixin prop foo customize less import library library mixin prop bar box my value library mixin prop outputs box my value bar unnamed lookups if you don t specify a lookup value in lookup and instead write after a mixin or ruleset call all values will cascade and the last declared value will be selected meaning the averaging mixin from the above example could be written as average x y result x y 2 div call a mixin and look up its final value padding average 16px 50px the output is the same div padding 33px the same cascading behavior is true for rulesets or variables aliased to mixin calls dr value foo box my value dr this outputs box my value foo unlocking mixins variables into caller scope deprecated use property value accessors variables and mixins defined in a mixin are visible and can be used in caller s scope there is only one exception a variable is not copied if the caller contains a variable with the same name that includes variables defined by another mixin call only variables present in callers local scope are protected variables inherited from parent scopes are overridden note this behavior is deprecated and in the future variables and mixins will not be merged into the caller scope in this way example mixin width 100 height 200px caller mixin width width height height results in caller width 100 height 200px variables defined directly in callers scope cannot be overridden however variables defined in callers parent scope is not protected and will be overridden mixin size in mixin definedonlyinmixin in mixin class margin size definedonlyinmixin mixin size globaly defined value callers parent scope no protection results in class margin in mixin in mixin finally mixin defined in mixin acts as return value too unlock value outer mixin dosomething nested mixin declaration value namespace unlock 5 unlock dosomething mixin dosomething nested mixin was copied here and is usable results in namespace declaration 5 recursive mixins edit the markdown source for mixin loops creating loops in less a mixin can call itself such recursive mixins when combined with guard expressions and pattern matching can be used to create various iterative loop structures example loop counter when counter 0 loop counter 1 next iteration width 10px counter code for each iteration div loop 5 launch the loop output div width 10px width 20px width 30px width 40px width 50px a generic example of using a recursive loop to generate css grid classes generate columns 4 generate columns n i 1 when i n column i width i 100 n generate columns n i 1 output column 1 width 25 column 2 width 50 column 3 width 75 column 4 width 100 mixin guards edit the markdown source for mixin guards guards are useful when you want to match on expressions as opposed to simple values or arity if you are familiar with functional programming you have probably encountered them already in trying to stay as close as possible to the declarative nature of css less has opted to implement conditional execution via guarded mixins instead of if else statements in the vein of media query feature specifications let s start with an example mixin a when lightness a 50 background color black mixin a when lightness a 50 background color white mixin a color a the key is the when keyword which introduces a guard sequence here with only one guard now if we run the following code class1 mixin ddd class2 mixin 555 here s what we ll get class1 background color black color ddd class2 background color white color 555 guard comparison operators the full list of comparison operators usable in guards are additionally the keyword true is the only truthy value making these two mixins equivalent truth a when a truth a when a true any value other than the keyword true is falsy class truth 40 will not match any of the above definitions note that you can also compare arguments with each other or with non arguments media mobile mixin a when media mobile mixin a when media desktop max a b when a b width a max a b when a b width b guard logical operators you can use logical operators with guards the syntax is based on css media queries use the and keyword to combine guards mixin a when isnumber a and a 0 you can emulate the or operator by separating guards with a comma if any of the guards evaluate to true it s considered a match mixin a when a 10 a 10 use the not keyword to negate conditions mixin b when not b 0 type checking functions lastly if you want to match mixins based on value type you can use the is functions mixin a b 0 when isnumber b mixin a b black when iscolor b here are the basic type checking functions iscolor isnumber isstring iskeyword isurl if you want to check if a value is in a specific unit in addition to being a number you may use one of ispixel ispercentage isem isunit aliasing mixins edit the markdown source for mixins aliasing released v3 5 0 assigning mixin calls to a variable mixins can be assigned to a variable to be called as a variable call or can be used for map lookup theme dark navbar colors light primary purple colors dark primary black secondary grey navbar colors theme dark navbar colors dark background colors primary border 1px solid colors secondary this would output navbar background black border 1px solid grey variable calls entire mixin calls can be aliased and called as variable calls as in library colors background green box alias library colors alias outputs box background green note unlike mixins used in root mixin calls assigned to variables and called with no arguments always require parentheses the following is not valid library colors background green box alias library colors alias error could not evaluate variable call alias this is because it s ambiguous if variable is assigned a list of selectors or a mixin call for example in less 3 5 this variable could be used this way box alias library colors alias a b the above would output box library colors a b detached rulesets edit the markdown source for detached rulesets assign a ruleset to a variable released v1 7 0 a detached ruleset is a group of css properties nested rulesets media declarations or anything else stored in a variable you can include it into a ruleset or another structure and all its properties are going to be copied there you can also use it as a mixin argument and pass it around as any other variable simple example declare detached ruleset detached ruleset background red semi colon is optional in 3 5 0 use detached ruleset top detached ruleset compiles into top background red parentheses after a detached ruleset call are mandatory except when followed by a lookup value the call detached ruleset would not work it is useful when you want to define a mixin that abstracts out either wrapping a piece of code in a media query or a non supported browser class name the rulesets can be passed to mixin so that the mixin can wrap the content e g desktop and old ie rules media screen and min width 1200px rules html lt ie9 rules header background color blue desktop and old ie background color red here the desktop and old ie mixin defines the media query and root class so that you can use a mixin to wrap a piece of code this will output header background color blue media screen and min width 1200px header background color red html lt ie9 header background color red a ruleset can be now assigned to a variable or passed in to a mixin and can contain the full set of less features e g my ruleset my selector background color black you can even take advantage of media query bubbling for instance my ruleset my selector media tv background color black media orientation portrait my ruleset which will output media orientation portrait and tv my selector background color black a detached ruleset call unlocks returns all its mixins into caller the same way as mixin calls do however it does not return variables returned mixin detached ruleset with a mixin detached ruleset mixin color blue call detached ruleset caller detached ruleset mixin results in caller color blue private variables detached ruleset color blue this variable is private caller color color syntax error scoping a detached ruleset can use all variables and mixins accessible where it is defined and where it is called otherwise said both definition and caller scopes are available to it if both scopes contains the same variable or mixin declaration scope value takes precedence declaration scope is the one where detached ruleset body is defined copying a detached ruleset from one variable into another cannot modify its scope the ruleset does not gain access to new scopes just by being referenced there lastly a detached ruleset can gain access to scope by being unlocked imported into it note unlocking variables into scope via a called mixin is deprecated use property variable accessors definition and caller scope visibility a detached ruleset sees the caller s variables and mixins detached ruleset caller variable caller variable variable is undefined here caller mixin mixin is undefined here selector use detached ruleset detached ruleset define variable and mixin needed inside the detached ruleset caller variable value caller mixin variable declaration compiles into selector caller variable value variable declaration variable and mixins accessible from definition win over those available in the caller variable global detached ruleset will use global variable because it is accessible from detached ruleset definition variable variable selector detached ruleset variable value variable defined in caller will be ignored compiles into selector variable global referencing won t modify detached ruleset scope a ruleset does not gain access to new scopes just by being referenced there detached 1 scope detached one two one one visible two detached 2 detached 1 copying renaming ruleset two visible ruleset can not see this variable use place one two detached 2 throws an error error 1 32 the variable one was not declared unlocking will modify detached ruleset scope a detached ruleset gains access by being unlocked imported inside a scope space importer 1 detached scope detached variable define detached ruleset importer 2 variable value unlocked detached ruleset can see this variable space importer 1 unlock import detached ruleset use place importer 2 unlock import detached ruleset second time detached compiles into use place scope detached value property variable accessors lookup values released v3 5 0 starting in less 3 5 you can use property variable accessors also called lookups to select a value from variable detached rulesets config option1 true option2 false mixin when config option1 true selected value box mixin outputs box selected value if what is returned from a lookup is another detached ruleset you can use a second lookup to get that value config colors primary blue box color config colors primary variable variables in lookups the lookup value that is returned can itself be variable as in you can write config dark primary dark...