Yelp Facebook LinkedIn YouTube Twitter Instagram

Classes available in-person (strict social distancing) or live online with an extended free retake period. See details.

Noble Desktop Blog | Tutorials, Resources, Tips & Tricks

Articles on: Coding Tips

Increase & Decrease Numbers in Sublime Text

Sublime Text with Emmet allows you to quickly adjust numbers in your code.

For example, you want to change 20px to 22px. Instead of selecting and typing the new number, click on the number and hit Ctrl–Up Arrow (Mac and Windows) to increase it 1px at a time. Increments of 0.1 and 10 also work:

Increase/Decrease by 0.1: Hold Option (Mac) or Alt (Windows) and hit Up or Down Arrow 
Increase/Decrease by 1: Hold Ctrl (Mac or Windows) and hit Up or Down Arrow 
Increase/Decrease by 10: Hold Cmd–Option (Mac) or Shift–Alt (Windows) and hit Up or Down Arrow

Coding Tips

Place Multiple Text Cursors in Sublime Text

Some text editors only allow one text cursor, but Sublime Text allows multiple. This is really useful, for example, if you want to insert the same word in multiple places.

Click anywhere in the code to place the text cursor. Cmd–Click (Mac) or Ctrl–Click(Windows) to place an additional text cursor. You can place as many cursors as you want!

Coding Tips

Quickly Select Everything Inside a Tag

With Sublime Text you can quickly select everything inside an HTML tag. Just click anywhere inside the tag and hit Cmd–Shift–A (Mac) or Ctrl–Shift–A (Windows).

Coding Tips

Quickly Delete a Word in Any Text Editor

Hit Option–Delete (Mac) or Ctrl–Backspace (Windows) to delete the word to the left of the cursor. This is an operating system feature so it should work in any text editor. 

This same technique can be also be used in the opposite direction. Hit Option–Fn–Delete (Mac) or Ctrl–Delete (Windows) to delete the word to the right of the text cursor.

Coding Tips

Quickly Code CSS text-align: center in Sublime Text

In CSS, type tac and hit Tab to expand to text-align: center;

Coding Tips

Select Next or Previous Item in Sublime Text

In HTML or CSS, hit Cmd–Shift–Period (Mac) or Ctrl–Shift–Period (Windows) to select the next item. To select the previous item, hit Cmd–Shift–Comma (Mac) or Ctrl–Shift–Comma (Windows).

In HTML, items are tag names, attributes, and attribute values. In CSS, items are selectors, properties, and property values.

Learn HTML and more in our coding classes.

Coding Tips

Quickly Link Stylesheets to HTML Documents in Sublime Text

In an HTML file, type link and hit Tab to expand to <link rel="stylesheet" href="">. Type the URL of the desired CSS file.

Use this tip to quickly apply concepts you can learn in our CSS class.

Coding Tips

Quickly Start an HTML File in Sublime Text

To start a new HTML page, first create a new file in Sublime Text and save it with the .html extension. This will set the syntax of your document to HTML. Then type ! (that’s an exclamation point) and hit Tab to expand it. Emmet will create the HTML page structure for you, allowing you to get right to work.

Coding Tips

Insert New Line in Sublime Text

To insert a new line below the current line in your code, hit Cmd–Return (Mac) or Ctrl–Enter(Windows). You can also insert a new line above the current line by using Cmd–Shift–Return(Mac) or Ctrl–Shift–Enter (Windows).

Coding Tips

Delete Line in Sublime Text

To quickly delete a line in your code, place your cursor anywhere in the line and hit Ctrl–Shift–K (Mac and Windows).

Coding Tips