I have a gallery page and a lot of images to put in it on my website. I have made an element structure which organizes the current images is I want them.

The image is inside a wrapper, which sorts out padding and positioning.

The img tag elements themselves have a class, alt text, title and loading attribute. Is there a way that I can insert as many of these as I want quickly?

This is my code:

    <div >
      <img
        src=".//assets/carina-nebula.jpg"
        
        alt="Carina Nebula"
        title="Click to enlarge"
        loading="lazy"
      />
    </div>

Like emmet in VSCode allows you to insert as many elements as you want at a time by defining the shorthand for a tag and following it with "*5", to make 5 duplicate elements; is there a shorthand to insert this element structure?

I've probably not explained this very well, so if any clarification is needed just let me know. Thanks!

CodePudding user response：

You can create custom code snippets. See vscode docs.

CodePudding user response：

• copy the text needed
• Create as many empty lines as you want to replicate
• Place cursor on first empty line
• Shift Alt Click on last empty line
• Ctrl V
• Esc