Генераторы верстки для WebStorm\PhpStorm в стиле Emmet


[tab] — нажимаем TAB

lorem[tab]
Стандартная «рыба» Lorem ipsum

lorem*5[tab]
Рыба повторяющаяся 5 раз в дивах

lorem512[tab]
Рыба длинной 512 символов

.name-class[tab]
создаст div элемент с классом name-class

.name-class*3[tab]
создаст 3-ть div элемент с классом name-class

        <div class="name-class"></div>
        <div class="name-class"></div>
        <div class="name-class"></div>

#id-elem[tab]
создаст div элемент с ID=id-elem

<div id="id-elem"></div>

teg-name.name-class[tab]
Создаст тег tag-name c классом name-class

tag1>tag2.name-class[tab]
Создаст тег tag1 c вложенным элементом tag2 c классом name-class

    <tag1>
        <tag2 class="name-class"></tag2>
    </tag1>

tag1+tag2+tag3[tab]
Создать теги без вложений

        <tag1></tag1>
        <tag2></tag2>
        <tag3></tag3>

tag1>tag{is text}[tab]
Создать тег в содержащий текст «is text»

<tag>is text</tag>

tag{is text $}*2[tab]
2-ды создать тег в содержащий текст «is text _номер строки_»

 <tag>is text 1</tag>
 <tag>is text 2</tag>

tag[data-test="xxx"][tab]
Добавить тег tag c атрибутом data-test со значением «xxx»

<tag data-test="xxx"></tag>

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *