Δημιουργία placeholder εικόνας

Τεκμηρίωση
API

Πώς να το χρησιμοποιήσετε;

Καθορίστε το μέγεθος της επιθυμητής εικόνας απευθείας στη διεύθυνση URL κλήσης. Μπορείτε να χρησιμοποιήσετε τις δημιουργημένες εικόνες στο HTML ή το CSS σας ακολουθώντας το παράδειγμα

Η πρώτη παράμετρος καθορίζει το πλάτος της εικόνας

Η δεύτερη παράμετρος καθορίζει το ύψος της εικόνας. Αυτό είναι προαιρετικό. Εάν δεν οριστεί, το ύψος θα είναι το ίδιο με το πλάτος της εικόνας (η εικόνα θα είναι τετράγωνη).


        <img src="https://cdrn.fr/60" alt="placeholder image">
        <img src="https://cdrn.fr/120x100" alt="placeholder image">
        <img src="https://cdrn.fr/80x100" alt="placeholder image">

Παραδείγματα

Τετράγωνες εικόνες


        <img src="https://cdrn.fr/32" alt="placeholder image">
        <img src="https://cdrn.fr/64" alt="placeholder image">
        <img src="https://cdrn.fr/96" alt="placeholder image">
        <img src="https://cdrn.fr/128" alt="placeholder image">

Εικόνες με συγκεκριμένα ύψη


        <img src="https://cdrn.fr/100x60" alt="placeholder image">
        <img src="https://cdrn.fr/200x120" alt="placeholder image">
        <img src="https://cdrn.fr/75x120" alt="placeholder image">
        <img src="https://cdrn.fr/150x240" alt="placeholder image">

Συχνές ερωτήσεις

Σε ποια μορφή εμφανίζεται η εικόνα που δημιουργείται;

Οι εικόνες επιστρέφονται σε μορφή JPEG, βελτιστοποιημένες για τον Ιστό. Το βάρος παραμένει ελάχιστο ακόμη και για μεγάλες διαστάσεις, γεγονός που καθιστά το εργαλείο κατάλληλο για μακέτες HTML και CSS που περιέχουν πολλά σύμβολα κράτησης θέσης. Το οπτικό περιεχόμενο είναι ένα ντεγκραντέ ή ουδέτερο χρώμα γεμίσματος, ποτέ μια πραγματική φωτογραφία που προστατεύεται από πνευματικά δικαιώματα.

Υπάρχει όριο μεγέθους για τις εικόνες που δημιουργούνται;

Οι λογικές διαστάσεις κυμαίνονται από 16 px έως περίπου 2000 px ανά πλευρά. Από εκεί και πέρα, η απόδοση παραμένει δυνατή, αλλά η παραγωγή γίνεται αργή χωρίς ουσιαστική χρήση, καθώς τα σύμβολα κράτησης θέσης προορίζονται για πιο μέτρια μοντέλα. Για μια εικόνα ήρωα 1920 x 1080, το εργαλείο αποκρίνεται χωρίς πρόβλημα.

Είναι η διεύθυνση URL σταθερή και μπορεί να χρησιμοποιηθεί στην παραγωγή;

Το URL /image// είναι ντετερμινιστικό, μπορείτε να το επικολλήσετε όπως είναι στις ετικέτες σας χωρίς να το κάνετε πρώτα λήψη. Για περιβάλλον παραγωγής, προτιμήστε να φιλοξενείτε τις τελικές εικόνες στο σπίτι: αυτή η υπηρεσία προορίζεται κυρίως για μοντέλα, βιβλία ιστοριών και δοκιμές ενσωμάτωσης.

Πώς διαφέρει από το Lorem Picsum ή το Placeholder.com;

Το Lorem Picsum επιστρέφει πραγματικές τυχαίες φωτογραφίες, που είναι ωραίο να δίνουν ρεαλισμό σε ένα μοντέλο. Το Placeholder.com προβάλλει εικόνες με ετικέτες με διαστάσεις. Η γεννήτρια cdrn επιστρέφει τα σύμβολα κράτησης θέσης απλά και γρήγορα, χωρίς εξωτερικές κλήσεις ή εξαρτήσεις τρίτων στο έργο σας στο front-end.

Μπορούμε να επιλέξουμε το χρώμα του σύμβολο κράτησης θέσης;

Όχι σε αυτή την έκδοση. Οι εικόνες δημιουργούνται με προκαθορισμένη ουδέτερη απόδοση. Εάν χρειάζεται να ελέγξετε με ακρίβεια το χρώμα του φόντου για να επικυρώσετε μια διάταξη με αντιθέσεις, δημιουργήστε ένα στατικό αρχείο μερικών kilobyte στην επιθυμητή απόχρωση ή χρησιμοποιήστε απευθείας ένα CSS div με χρώμα φόντου.

Ποιο είναι το όφελος για έναν προγραμματιστή front-end;

Δοκιμάστε γρήγορα μια διάταξη χωρίς να χρειάζεται να παρέχετε μια πραγματική εικόνα, επικυρώστε την ανταπόκριση ενός πλέγματος σύροντας πολλές αναλογίες, τροφοδοτήστε ένα βιβλίο ιστοριών ή μια προεπισκόπηση Figma-to-HTML. Για επαγγελματίες του μάρκετινγκ και σχεδιαστές, το εργαλείο χρησιμοποιείται για τη σχεδίαση καλωδίων υψηλής πιστότητας χωρίς να βασίζεται σε φωτογραφίες με άδεια χρήσης.

αυτό το εργαλείο δεν εκθέτει API εκτέλεσης