Questions tagged [emmet]

Emmet (previously Zen Coding) is a set of text editor plugins allowing for high-speed coding in HTML, XML, XSL, and other structured code formats by expanding CSS-like expressions of elements into their corresponding representation.

Emmet (previously known as Zen Coding) is a set of plug-ins for text editors that allow for high-speed coding in HTML, XML, XSL, and other structured code formats via content assist. The project was started by Vadim Makeev in 2008 and continues to be actively developed by Sergey Chikuyonok.

Emmet takes the snippets idea to a whole new level: you can type CSS-like expressions that can be dynamically parsed, and produce output depending on what you type in the abbreviation. Emmet is developed and optimized for web-developers whose workflow depends on HTML/XML and CSS but can be used with other programming languages too.

http://docs.emmet.io

741 questions
6
votes
0 answers

Generate Emmet code from HTML - reverse action

I am talking about Emmet.io (former Zen Coding). Is there JavaScript code or jQuery plugin that does that in reverse? Example: emmet('ul > li*3') => '
' I want something like…
Iggy
  • 93
  • 1
  • 5
5
votes
0 answers

my vscode emmet not work since last update

Exclamation mark ! for html template not work in my vs code since the new update , and some others emmet like li*5 not work. I also reinstalled it but nothing fair with it. So , anyone check it.
5
votes
2 answers

how do I add a comment tag in VSCode for HTML using Emmet?

How to add a comment tag in HTML using Emmet in VSCode? What I want: Before:
After using Emmet keyboard shortcut:
Kushal Kumar
  • 174
  • 1
  • 13
5
votes
1 answer

Emmet with styled components autocompletion

Im used to emmet autocompleting things like df = display flex tac = text align center now when I type this inside style components I have to type it very fast otherwise emmet recognises df as dfn and tac as touch-action how can I configure it so it…
balui
  • 147
  • 1
  • 2
  • 11
5
votes
2 answers

Is it possible to use emmet's lorem in javascript's strings?

I'd like emmet to help me with this: const str = 'lorem5|TAB'; --> const str = 'Lorem ipsum dolor sit amet.'; | cursor position TAB hitting tab Is it possible in VSCode? It works for me only with jsx and html.
Sebastian
  • 1,225
  • 1
  • 16
  • 27
5
votes
2 answers

VSCode: How to make Beautify and Emmet run on .tpl files (Smarty)?

I'm working on an old project on VSCode, and I found out that the html formatter and emmet syntax isn't working for .tpl (Smarty templating engine) files. It's inconveniencing my workflow, and unfortunately I don't see any extensions in the…
Abana Clara
  • 4,602
  • 3
  • 18
  • 31
5
votes
5 answers

Tab key is not working in visual studio code

Tab key is not working for abbreviation in visual studio code.I have tried lot.How can I fix the problem?I am frustrated.Thinking of using Bracket instead of visual studio code.
Somen
  • 61
  • 1
  • 3
5
votes
2 answers

Parent selector for zen-coding

I just discovered zen-coding. I have the following snippet of code I want to generate.
DMin
  • 10,049
  • 10
  • 45
  • 65
5
votes
1 answer

JSX: Emmet auto-completion for elements that contain dots (E.g. Grid.Column)?

Is it possible to autocomplete elements that contain dots in their name? E.g., in WebStorm, if I type Grid [tab] I get , as expected. However, if I type Grid.Column [tab], I get . Is it possible to…
bjornl
  • 1,757
  • 3
  • 17
  • 29
5
votes
2 answers

How change short keys in Vim?

I am a new user in Vim. How change these keys in Zen Coding, ctr+y+, To ctr+e And also change in omni, ctr+x ctr+o To ctr+j How can I do that?
Tarek Saied
  • 6,482
  • 20
  • 67
  • 111
5
votes
10 answers

How to add html attributes and values for all lines quickly with vim and plugins?

My os:debian8. uname -a Linux debian 3.16.0-4-amd64 #1 SMP Debian 3.16.39-1+deb8u2 (2017-03-07) x86_64 GNU/Linux Here is my base file. home help variables compatibility modelines searching selection markers indenting reformatting folding…
showkey
  • 482
  • 42
  • 140
  • 295
5
votes
2 answers

How use Emmet in PHPStorm in PHP files?

Emmet only works in HTML & CSS files How can I use it in PHP files in the IDEs like PHPStorm? li*5"; ?>
nadaram
  • 101
  • 2
  • 15
5
votes
4 answers

Put each tag on a new line when wrapping with Emmet in PhpStorm

In PhpStorm 9.0 when wrapping a list of values, for example: Item 1 Item 2 Item 3 With different abbreviations, for example: p.$* I have the input all in one line, like this:

Item 1

Item 2

Item…

Boykodev
  • 850
  • 1
  • 10
  • 23
5
votes
1 answer

Create void tag / self-closing tag for custom element

I want to create a custom void tag: Currently, when I type mycustomtag it gets transformed to Is there a way in Emmet to make the tag void? I couldn't find it in the docs.
Stefan van den Akker
  • 6,661
  • 7
  • 48
  • 63
5
votes
2 answers

Sublime Text 2 + Emmet - not expanding correctly

I have installed emmet for Sublime Text 2... And it works - kind a strange way When I enter d it starts showing possibilities, but as soon as I press: : emmet shows completely different tip: b (bottom) So I need to press esc to close fuzzysearch…
Marcin Bobowski
  • 1,745
  • 2
  • 19
  • 35