Coding With Fun
Home Docker Django Node.js Articles Python pip guide FAQ Policy

Flexible shortcuts keep the programming process hands on the keyboard


May 25, 2021 HBuilder


Table of contents


Flexible shortcuts keep the programming process hands on the keyboard

The effect is shown below

Flexible shortcuts keep the programming process hands on the keyboard

  • After creating a new html base template, the current cursor is inside the title label, at which point we set the HTML to the title:hellohbuilder, and when we're done, insert an empty line on the next line of the current line using Ctrl plus carriage return, and move the cursor to the next line

  • Here we use the sc block to generate a script block to write the js code (enter sc, enter) as shown below

Flexible shortcuts keep the programming process hands on the keyboard

  • Use the funn block to write a JS method helloworld (enter funn, enter) as shown below

Flexible shortcuts keep the programming process hands on the keyboard

  • The method name of the method generated at this point is selected, and we just need to enter the new method name helloworld directly, as shown in the following image

Flexible shortcuts keep the programming process hands on the keyboard

  • The green vertical line in the image above is the next edit position specified in the block of code, and tapping the return cursor jumps directly to the vertical position

  • At this point press down, down, Ctrl plus enter, enter style return, generate the css code area

  • Define a Css classclassA: Input. c l a s s a s a s

  • Then press alt plus, alt plus jump down to the next edit area

  • You can also enter the slt;dv return, the syntax assistant can find out the label you want to generate by fuzzy matching, as shown below

Flexible shortcuts keep the programming process hands on the keyboard

  • As shown in the figure above, the code assistant contains numbers on the left, which you can use to select the corresponding entries, and browser compatibility data and examples on the right

  • Enter i carriage return d 1, right arrow, space, c carriage return

  • The mouse hovers over the class attribute classA of the div tag, presses the Alt and left buttons, and jumps to the classA definition

  • Ctrl plus carriage return

  • Div can also be generated from code blocks such as input divc carriage return return, enter helloworld as shown below

  • Down, return