Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
How to use image height and width attribute in HTML Page?
Images make content more interesting by helping readers to understand the content better on the web page.
We can insert images into the HTML page. To insert image in an HTML page, use the <img> tags. It is an empty tag, containing only attributes since the closing tag is not required.
The src attribute is used to add the image source which is the URL of the image(location of the file). The alt attribute is for adding alternate text, width is for adding width, and height is for adding the height of the image.
We use style attribute to make changes in the size of the image that is height and width of the image.
Syntax
Following is the syntax to change the height and width of the image on an HTML page.
<img src="url" alt="some_text" width="" height="">
Example
In the following example program, we used style attribute to make a change in the height of the image.
<!DOCTYPE html> <html> <body> <img src="https://www.tutorialspoint.com/opencv/images/opencv-mini-logo.jpg" height="300px"> </body> </html>
Example
In the following example program, we used style attribute to make change in the width of the image.
<!DOCTYPE html> <html> <body> <img src=" https://www.tutorialspoint.com/opencv/images/opencv-mini-logo.jpg" width="500px"> </body> </html>
Example
In the following example program, we used style attribute to make change in both width and height of the image.
<!DOCTYPE html> <html> <body> <img src="https://www.tutorialspoint.com/opencv/images/opencv-mini-logo.jpg" height="200"width="400px"> </body> </html>
1K+ Views
