Εικόνα σε Base64
Αφήστε οποιαδήποτε εικόνα σε αυτόν τον μετατροπέα εικόνας σε Base64 για να λάβετε data URI και έτοιμα αποσπάσματα για HTML, CSS και JavaScript. Οι ενσωματωμένες εικόνες εξοικονομούν αιτήματα HTTP για μικρά εικονίδια και είναι απαραίτητες για HTML ενός αρχείου, πρότυπα e-mail και εφαρμογές offline.
Πώς να μετατρέψετε Εικόνα σε Base64 online
- Επιλέξτε ένα αρχείο εικόνας ή επικολλήστε ένα URL εικόνας.
- Επιλέξτε την έξοδο: data URI,
<img>, CSS background, favicon, JSON και άλλα. - Κάντε κλικ στο Κωδικοποίηση εικόνας σε Base64.
- Προεπισκοπήστε την εικόνα και αντιγράψτε τον κώδικα.
Περισσότεροι μετατροπείς Εικόνα σε Base64
Μορφές εξόδου
Επιλέξτε πώς θα περιτυλιχθεί το αποτέλεσμα. Ο μετατροπέας μπορεί να επιστρέψει:
- txt: μόνο η συμβολοσειρά Base64, έτοιμη για επικόλληση σε κώδικα, πεδίο βάσης δεδομένων ή αίτημα API.
- uri: πλήρες URI
data:που μπορείτε να επικολλήσετε στη γραμμή διευθύνσεων του προγράμματος περιήγησης ή να χρησιμοποιήσετε οπουδήποτε γίνεται αποδεκτό ένα URL. - html img: ετικέτα
<img>με το data URI στοsrc. - css background image: κανόνας CSS με
background-image: url(data:...). - html favicon: ετικέτα
<link rel="icon">για ενσωματωμένο favicon. - html hyperlink: σύνδεσμος
<a>που κατεβάζει ή ανοίγει το ενσωματωμένο αρχείο. - html iframe: ένα
<iframe>που εμφανίζει το περιεχόμενο ενσωματωμένα. - javascript image: JavaScript που δημιουργεί αντικείμενο
Image. - javascript popup: JavaScript που ανοίγει το περιεχόμενο σε νέο παράθυρο.
- json: αντικείμενο JSON με το όνομα αρχείου, τον τύπο MIME και τα δεδομένα.
- xml: στοιχείο XML με τα δεδομένα μέσα σε ενότητα CDATA.
Πότε πρέπει να ενσωματώνετε εικόνες ως Base64;
Ενσωματώστε μικρές εικόνες (κάτω από περίπου 5–10 KB) όπως εικονίδια, λογότυπα και placeholders για εξοικονόμηση αιτημάτων. Αποφύγετε την ενσωμάτωση μεγάλων φωτογραφιών: κάνουν το HTML/CSS βαρύτερο, δεν μπορούν να αποθηκευτούν προσωρινά ξεχωριστά και καθυστερούν την απόδοση. Για λεπτομερή συζήτηση δείτε τα data URI εξηγημένα.
Συχνές ερωτήσεις
Πώς μετατρέπω μία εικόνα σε Base64;
Επιλέξτε την εικόνα σας, επιλέξτε «Data URI» ή «<img>» ως έξοδο και κάντε κλικ στο «Κωδικοποίηση εικόνας σε Base64». Αντιγράψτε το αποτέλεσμα στο HTML ή CSS σας.
Ποιες μορφές εικόνας υποστηρίζονται;
Οποιαδήποτε μορφή που μπορεί να διαβάσει το πρόγραμμα περιήγησής σας: PNG, JPG/JPEG, GIF, WebP, SVG, BMP, ICO, AVIF, TIFF και άλλα.
Πώς χρησιμοποιώ μία εικόνα Base64 σε HTML;
Βάλτε το data URI στο χαρακτηριστικό src: <img src="data:image/png;base64,iVBORw0KGgo..." alt="">.
Σχόλια (0)
Ερωτήσεις, ιδέες ή σφάλμα στο «Εικόνα σε Base64»; Αφήστε ένα σχόλιο, βαθμολογήστε το εργαλείο ή απαντήστε σε άλλους.
Δεν υπάρχουν ακόμα σχόλια. Γίνετε ο πρώτος που θα μοιραστεί τα σχόλιά του!