HTML छवि का आकार किसी छवि की ऊंचाई और चौड़ाई को दर्शाता है। वे . पर HTML विशेषताओं के रूप में सूचीबद्ध हैं तत्व। यहां उन्हें सेट करने का तरीका बताया गया है।
सिंटैक्स
<img> . की चौड़ाई और ऊंचाई विशेषताओं को सेट करने के लिए सिंटैक्स टैग है:
<img src="<name of website>" alt="<alt tag>" height="<in px>" width="<in px>" />
यहां एक कोड स्निपेट दिखाया गया है कि यह कैसे काम करता है:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title>repl.it</title> <link href="style.css" rel="stylesheet" type="text/css" /> </head> <body> <h1>Image Size in HTML</h1> <h2>without attributes</h2> <img src="https://placekitten.com/500/500" /> <h2>with attributes</h2> <img src="https://placekitten.com/500/500" width="300" height="300" /> <script src="script.js"></script> </body> </html>
<img> . की ऊंचाई और चौड़ाई तत्व पिक्सेल में एक संख्या है (उद्धरण के बीच में)। ऊंचाई और चौड़ाई दोनों विशेषताओं को इंगित करना एक अच्छा विचार है ताकि वेब पेज लोड होने से पहले छवि के लिए स्थान आवंटित किया जा सके। यदि पृष्ठ रेंडर करने से पहले छवि का आकार इंगित नहीं किया गया है, तो छवि लोड होने पर पृष्ठ अपने लेआउट को समायोजित कर लेगा।
ब्राउज़र समर्थन
<img> . की चौड़ाई और ऊंचाई विशेषताएँ तत्व सभी वेब ब्राउज़र पर समर्थित है।