CSS Editor: TopStyle Pro Usage Tips

When you write CSS may think that Notepad is not the best, what CSS editing tools can improve the efficiency of our coding?

TopStyle is I have been using the CSS editing tools, the beginning is blind and did not study carefully, but later the function of the inside carefully looked at the discovery of its function is really too powerful!

Here to share the experience, I used to edit the CSS when the shortcut keys:

Text Note: shift+ctrl+m

Indent right: shift+ctrl+.

Indent Left: shift+ctrl+,

Next css:ctrl+]

Last css:ctrl+[

Selected color: shift+ctrl+c

cannot be revoked after saving (ctrl+z)?

We'll change it. Option Location: options--editor--Select Enable Undo after Save

Auto Replace

For example, if you hit "!i" and then press a space, TopStyle automatically replaces "!i" with "!important".

Option location: Options--editor--auto Replace You can also add your own shortcut input.

Tree-Type CSS

Sometimes do not feel css too much to browse? TopStyle provides a convenient way to hide CSS content by displaying only the name of the selector.

Option location: Options--editor--rule Collapsing select Enable rule collapsing

Quick Check

The Validator and the Validator HTML buttons on the shortcut menu are handy, so you can tell if you've passed the checksum by editing it directly.

Style sheet Scavenger

Below solemnly recommend TopStyle with CSS collation function. Style sheet Scavenger style sweeper. It can organize your CSS very neatly, the specification. A very good feature.

Option Location: Tools--style Sweeper

Rules Rules panel: Rule Format can set up a single line of multiple lines of display.

The Combine Rules setting will have CSS combinations of the same attributes.

Selectors selector Panel: Selector case Settings Selector.

Selector the Order settings selector.

Property Properties Panel: The case of property set properties.

Property order sets the way properties are sorted. Shorthand properties Abbreviation Property panel: You can select the font, background, margin, padding attribute abbreviations.

Others other properties panel:

Color format Color formats: You can choose hexadecimal, RGB, color names, and so on.

Said so much or hope everyone in practice constantly improve their CSS ability, TopStyle is a good helper!