Στο vue, η εικόνα εμφανίζεται στο div σε αναλογία με το αρχικό μέγεθος του image

Στο vue, η εικόνα εμφανίζεται στο div ανάλογα με το αρχικό μέγεθος της εικόνας.

2024-07-12

Η εικόνα εμφανίζεται στο div σε αναλογία με το αρχικό μέγεθος της εικόνας, γεγονός που διασφαλίζει ότι η εικόνα που εμφανίζεται στον Ιστό έχει το ίδιο σχήμα με την πραγματική εικόνα και διατηρεί το αρχικό εφέ εικόνας.

Ο κώδικας υλοποίησης είναι ο εξής:


<div style="padding: 0; width:400px;height:400px;position: absolute;border: 1px solid #eff2f6;">
   <img :src="imgOptions.img" style="width: 100%;height:100%;object-fit: contain;"/>
</div>

Το αποτέλεσμα είναι το εξής:

Κοινή χρήση τεχνολογίας

Στο vue, η εικόνα εμφανίζεται στο div ανάλογα με το αρχικό μέγεθος της εικόνας.

Προσωπικό προφίλ

τα στοιχεία επικοινωνίας μου