Emmet

https://emmet.io/documentation
Admin
Emmet is a plugin for popular text editors that greatly improves HTML and CSS workflow through...
Tokens:658
Snippets:12
Trust Score:9.4
Update:4 months ago
Show doc for...
Tokens:
Raw
### Basic HTML Document Structure

Source: https://emmet.io

A minimal HTML5 document structure generated by Emmet. This serves as a basic template for web pages.

```html
<!doctype html>
```

```html
<html lang="en">
```

```html
<head>
```

```html
    <title>Demo</title>
```

```html
</head>
```

```html
<body>
```

```html
    
```

```html
</body>
```

```html
</html>
```

--------------------------------

### Navigate Between Edit Points

Source: https://emmet.io

Use Emmet's 'Next Edit Point' command to quickly move between important editable locations within the generated code. This facilitates efficient code modification.

```json
{
    "command": "emmet.next_edit_point",
    "times": 7
}
```

--------------------------------

### Select Next Item

Source: https://emmet.io

Emmet's 'Select Next Item' action helps in selecting important code segments. This can be used iteratively to select progressively larger parts of the code.

```json
{
    "command": "emmet.select_next_item",
    "times": 7,
    "beforeDelay": 300
}
```

--------------------------------

### Expand Abbreviation Action

Source: https://emmet.io

This snippet represents the command to trigger Emmet's 'Expand Abbreviation' action, which converts Emmet syntax into HTML.

```json
{
    "command": "emmet.expand_abbreviation"
}
```

--------------------------------

### Select Tag Pair

Source: https://emmet.io

The 'Match Tag Pair' action allows you to select the opening and closing tags of an HTML element. Use 'Match Tag Pair Outward' to expand the selection to include parent tags.

```json
{
    "command": "emmet.match_pair_outward",
    "times": 3
}
```

--------------------------------

### Expand CSS-like Abbreviation to HTML

Source: https://emmet.io

Type a CSS-like abbreviation and use Emmet's 'Expand Abbreviation' action to transform it into HTML markup. This is a core feature for rapid HTML generation.

```emmet
ul#nav>li.item$*4>a{Item $}
```

--------------------------------

### Toggle Comment Action

Source: https://emmet.io

Use Emmet's 'Toggle Comment' action to quickly add or remove HTML comments around selected code blocks or tags. This is useful for debugging or temporarily disabling code sections.

```json
{
    "command": "emmet.toggle_comment",
    "times": 2,
    "beforeDelay": 1000
}
```
Tokens:
Raw