Code Style. Less
for Windows and Linux
for macOS Ctrl+Alt+S
Use this section to configure formatting options for Less files. When you change these settings, results of a change are displayed in the Preview pane.
Tabs and Indents
|Use tab character|
An indentation consists of two parts. One part results from nesting code blocks, and the other part is determined by alignment.
|Tab size||In this field, specify the number of spaces that fits in a tab.|
|Indent||In this field, specify the number of spaces to be inserted for each indent level.|
In this field, specify the number of spaces to be inserted between the elements of an array, in expressions, method declarations, and method calls.
In this field, specify the number of spaces to be inserted between the values of properties.
|Keep indents on empty lines||If this checkbox is selected, WebStorm retains indents on empty lines as if they contained some code. If the checkbox is cleared, WebStorm deletes the tab characters and spaces on empty lines.|
Use this tab to define where and how many blank lines you want WebStorm to retain and insert in your code after reformatting. The results are displayed in the Preview pane.
|Keep Maximum Blank Lines||In this area, specify the number of extra blank lines to be kept after reformatting.|
|Minimum Blank Lines|
In this area, configure whether to have or not to have extra empty lines around top-level blocks and nested selectors. In the field next to each option, specify the minimum number of extra blank lines to be left.
In this tab, specify the alignment, braces, spaces, and quotes options to be applied on reformatting.
Use this list to specify where WebStorm should place the opening braces of selectors. The available options are:
Use this list to specify how WebStorm should align attributes and values. The available options are:
In the CSS, SCSS, and Less context, WebStorm by default uses double quotes for generated string literals in
To apply the chosen style to the entire file after reformatting, select the Enforce on format checkbox below the list.
|Align closing brace with properties|
If this checkbox is selected, the closing brace of the selector will be placed under the list of properties.
If this checkbox is not selected, the closing brace of the selector will be placed under the selector.
|Keep single-line blocks|
If this checkbox is selected, the blocks with a single property will be confined to one line.
If this checkbox is not selected, each property will be placed to its own line.
|Spaces||Select the checkboxes in this area to add a space after the colon delimiting key and value, and before the opening brace of the selector.|
Use this area to configure the hex color syntax. You can select from the following check options:
View changes in the Preview pane.
The link appears in the upper-right corner of the page, when applicable. Click this link and choose the language to be used as the base for the current language code style.
To return to the initial set of code style settings and discard the changes, click Reset.