用background替代img,防止图片变形

This commit is contained in:
马云海 mayunhai () 2019-06-06 17:00:31 +08:00
parent 08e64566ce
commit e6bd49b665
1 changed files with 4 additions and 2 deletions

View File

@ -5,7 +5,8 @@
<slot /> <slot />
</div> </div>
</div> </div>
<img :src="image" class="pan-thumb"> <!-- eslint-disable-next-line -->
<div :style="{backgroundImage: `url(${image})`}" class="pan-thumb"></div>
</div> </div>
</template> </template>
@ -52,7 +53,8 @@ export default {
.pan-thumb { .pan-thumb {
width: 100%; width: 100%;
height: 100%; height: 100%;
background-size: 100%; background-position: center center;
background-size: cover;
border-radius: 50%; border-radius: 50%;
overflow: hidden; overflow: hidden;
position: absolute; position: absolute;