Open original
Info
Demo 1.2

Attributes

An attribute is extra information attached to an element, written inside its opening tag:

<a href="https://gdwithgd.com/">A link</a>

href is the attribute and the URL is its value. Without it, a link element has no idea where to send anyone.

The rules

  • Attributes go in the opening tag only, never the closing one.
  • Values go in quotes.
  • An element can have as many as it needs, separated by spaces.

The two you’ll use forever

class and id don’t change how anything looks by themselves. They’re labels, so that CSS and JavaScript can find a specific element later. You’ll be using class constantly by the end of the next chapter.

Next demoBlock vs. Inline Elements
Keyboard Shortcuts
⌘ Z / ⌘ ⇧ ZCtrl Z / Ctrl ⇧ Z Undo / redo
Tab / ⇧ TabTab / ⇧ Tab Indent / unindent selection
⌘ ] / ⌘ [Ctrl ] / Ctrl [ Indent / unindent lines
⌘ ACtrl A Select all
⌘ DCtrl D Select next occurrence of selection
⌘ /Ctrl / Comment / uncomment lines
Ctrl SpaceCtrl Space Autocomplete
Ctrl EnterCtrl Enter Reset layout
⌘ ⌥ [ / ⌘ ⌥ ]Ctrl ⇧ [ / Ctrl ⇧ ] Fold / unfold block
Code
The editor didn't load — try refreshing the page. Navigation, shortcuts and the info panel still work in the meantime.
Preview
Dimensions0 × 0
Delay
Console