Hot keys — for effective work with Practice-CE1
🔥Ctrl+Space ➤Show code completion suggestions
🔥Shift+Tab ➤Autoformat selected code\
🔥Alt+F ➤Search
🔥Ctrl+/ ➤Add/Delete comment
🔥Ctrl+Q ➤Collapse and expand the code
🔥Ctrl+K ➤Open the color picker
🔥Ctrl+L ➤Select a line
🔥F9 ➤Sorting lines (Sublime Text)
🔥Shift+F9 ➤ Reverse line sorting (Sublime Text)
🔥Ctrl+D ➤Select the next occurrences of the selected text for editing (Sublime Text)
🔥Ctrl+Up ➤Scroll the window up one line without moving the cursor (Sublime Text)
🔥Shift+Ctrl+K ➤Delete line (Sublime Text)
🔥ControlLeft ➤ Pause/Play prompter animation
🔥Ctrl-Home ➤ Move the cursor to the beginning of the document
🔥Ctrl-End ➤ Move the cursor to the end of the document
Browser support by the Practice-CE1 editor
Browser support
✅Firefox version 4 and newer
✅Chrome any version
✅Safari version 5.2 and newer
✅Internet Explorer/Edge version 8 and newer\
✅ Opera version 9 and newer
✅Support for modern mobile browsers is experimental.
✅The latest versions of the iOS browser and Chrome on Android should work quite well.\n\
❗Recommended Google Chrome browser. In the Microsoft Edge browser, the file save function works like a download.
Grouping of buttons by types of HTML tags and CSS attributes.
Practice-CE1 has buttons for groups of tags in the main menu.
In order to optimize the space of the Practice editor menu, it was decided to group the tag buttons according to categories.
This grouping made it possible to save space in the Practice editor menu for adding new tags or menu items in the future.
Let's look at the basic logic of the menu presentation.
Categories of menu buttons.
HTML tag category buttons.
HTML tag category buttons are located at the top of the menu block and contain 9 categories.
- Structural
- Meta
- Semantic
- Samples
- Formatting
- Lists
- Media
- Interactive
- Table
Buttons CSS attributes.
CSS attribute buttons in the amount of 6 pieces are placed below the rows of HTML tag category buttons.
- CSS borders
- External CSS fields
- Internal CSS fields
- CSS background
- CSS color
- CSS text
Menu button colors.
Different colors of the Practice online editor menu buttons
You probably already paid attention to the different colors of the menu buttons of the Practice online editor, and this coloring is not random at all and has a certain meaning.
Buttons for categories of HTML tags and CSS attributes have a green color - this means that they can be expanded.
Groups of buttons that belong to the category of HTML tags or CSS attributes are colored blue.
How category buttons work HTML tags and CSS attributes.
When you click on the green button, it opens to the right and blue buttons become visible, with the help of which you can directly add tags or attributes to the working window of the Practice editor (see the picture above.).
If you press the green button again, the blue buttons will be hidden.