What does less in css mean?

In css, less is a preprocessing language that extends the css language to make css easier to maintain and expand; less is also a preprocessor that enables customizable, manageable and Reusable stylesheets so they can be read by web browsers.

The operating environment of this tutorial: Windows 10 system, CSS3&&HTML5 version, Dell G3 computer.

What does less mean in css

Less is a CSS preprocessing language that extends the CSS language and adds variables and mixin , functions and other features make CSS easier to maintain and expand.

LESS is a CSS preprocessor that enables customizable, manageable and reusable style sheets for websites. LESS is a dynamic style sheet language that extends the capabilities of CSS. LESS is also cross-browser friendly.

The CSS preprocessor is a scripting language that extends CSS and compiles it into regular CSS syntax so that it can be read by a web browser. It provides features like variables, functions, mixins, and actions to build dynamic CSS.

Less allows us to define variables, use nested declarations, define functions, etc. Strictly speaking, Less consists of two parts: (1) Less syntax and (2) Less preprocessor. After all, browsers only understand CSS, so Less files need to be compiled into CSS through the Less preprocessor.

The example is as follows:

@base: #f938ab;
.box-shadow(@style, @c) when (iscolor(@c)) {
  -webkit-box-shadow: @style @c;
  box-shadow:         @style @c;
}
.box-shadow(@style, @alpha: 50%) when (isnumber(@alpha)) {
  .box-shadow(@style, rgba(0, 0, 0, @alpha));
}
.box {
  color: saturate(@base, 5%);
  border-color: lighten(@base, 30%);
  div { .box-shadow(0 0 5px, 30%) }
}

The output is css code as follows:

.box {
  color: #fe33ac;
  border-color: #fdcdea;
}
.box div {
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
}

(Learning video sharing: css video tutorial)

The above is the detailed content of What does less in css mean?. For more information, please follow other related articles on the PHP Chinese website!