Image
Component name: <v-image-group>
+ <v-image>
Examples
Basic
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sodales, nibh eget venenatis vulputate, magna nisi tempus mi, nec congue ante lectus sed purus. Mauris consequat iaculis feugiat.
<div class="app">
<v-image-group>
<v-image src="http://lorempixel.com/1280/720/?image=1" alt="Lorem ipsum"></v-image>
<v-image src="http://lorempixel.com/1280/720/?image=2" alt="Lorem ipsum"></v-image>
<v-image src="http://lorempixel.com/1280/720/?image=3" alt="Lorem ipsum"></v-image>
<v-image src="http://lorempixel.com/1280/720/?image=4" alt="Lorem ipsum"></v-image>
<v-image src="http://lorempixel.com/1280/720/?image=5" alt="Lorem ipsum"></v-image>
<v-image src="http://lorempixel.com/1280/720/?image=6" alt="Lorem ipsum"></v-image>
<v-image src="http://lorempixel.com/1280/720/?image=7" alt="Lorem ipsum"></v-image>
<v-image src="http://lorempixel.com/1280/720/?image=8" alt="Lorem ipsum"></v-image>
<v-image src="http://lorempixel.com/1280/720/?image=9" alt="Lorem ipsum"></v-image>
<v-image src="http://lorempixel.com/1280/720/?image=10" alt="Lorem ipsum"></v-image>
<template v-slot:description>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sodales, nibh eget venenatis vulputate, magna nisi tempus mi, nec congue ante lectus sed purus. Mauris consequat iaculis feugiat.
</template>
</v-image-group>
</div>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
Components
v-image-group
Wrapper component for images.
API
Name | Type | Description | Default |
slot: description | Slot | Shows the following description | |
v-image
API
Name | Type | Description | Default |
src | String | Image source.
Valid value: Image URL | - |
alt | String | Alternate text | - |
Notice
All other properties that are not defined above, will be passed to the component as html attributes. This is especially useful for adding the class
attribute.