Как сниппетом создать div и объявить класс?

Frontend developer HTML / CSS
1

Как сделать div сниппетом я знаю: div Tab,

Как сделать несколько div я тоже знаю: div*3 Tab (получится 3 div).

Но как сделать так, что б при появлении этих div сразу объявлялся класс? Что б не пришлось потом каждому диву отдельно писать одно и то же... Уверен, что есть такая функция, но не знаю её. Подскажите пожалуйста.

2

Напиши

div.class-name

В результате получишь 

<div class="class-name">

Если хочешь создать сразу несколько дивов и вложить в них ещё дивы, можно написать так:

(div.class-name>div.sub-class-name*4)*5

После нажатия tab получаем:

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

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

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

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

<div class="class-name">
    <div class="sub-class-name">
    <div class="sub-class-name">
    <div class="sub-class-name">
    <div class="sub-class-name">
3

Можно еще использовать знак доллара, каждый последующий элемент будет прибавляться на единицу, указывают его в фигурных скобочках, вот так:

.container>.row>(.col-md-3>p{$}*16)*4

В результате мы получим 16 строк в каждом из блоков col-md-3 которые будут находится в блоке row, который в свою очередь будет в блоке container, вот что получится в общем:

<div class="container">
    <div class="row">
        <div class="col-md-3">
            1
            2
            3
            4
            5
            6
            7
            8
            9
            10
            11
            12
            13
            14
            15
            16
        
        <div class="col-md-3">
            1
            2
            3
            4
            5
            6
            7
            8
            9
            10
            11
            12
            13
            14
            15
            16
        
        <div class="col-md-3">
            1
            2
            3
            4
            5
            6
            7
            8
            9
            10
            11
            12
            13
            14
            15
            16
        
        <div class="col-md-3">
            1
            2
            3
            4
            5
            6
            7
            8
            9
            10
            11
            12
            13
            14
            15
            16