- Trending Categories
Data Structure
Networking
RDBMS
Operating System
Java
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
- 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 specify the URL of the image to use in different situations in HTML?
Use the srcset attribute to specify the URL of the image to use in different situations in HTML.
Example
You can try to run the following code to implement srcset attribute. Resize the browser to see different images loading −
<!DOCTYPE html> <html> <head> <meta name = "viewport" content="width=device-width, initial-scale = 1.0"> </head> <body> <picture> <source media = "(min-width: 550px)" srcset = "https://www.tutorialspoint.com/assets/videotutorials/courses/3d_animation_online_training/380_course_211_image.jpg"> <source media = "(min-width: 400px)" srcset = "https://www.tutorialspoint.com/assets/videotutorials/courses/html_online_training/380_course_216_image.jpg"> <img src = "https://www.tutorialspoint.com/videotutorials/images/tutorial_library_home.jpg" alt = "Tutorials Library" style = "width:auto;"> </picture> </body> </html>
Updated on 03-Mar-2020 11:25:00
- Related Questions & Answers
- How to specify the URL of the page the link goes to in HTML?
- How to specify the URL of the resource to be used by the object in HTML?
- How to use URL input type in HTML?
- How to specify an image as a client-side image-map in HTML?
- How to use window.location to redirect to a different URL?
- How to set the URL of the media file in HTML?
- How to specify the kind of text track in HTML?
- How to specify the HTTP method to use when sending form-data in HTML?
- How to specify the HTML content of the page to show in the <iframe> in HTML?
- How to use floating image in HTML page?
- How to specify the language of the element's content in HTML?
- How to use window.location to redirect to a different URL with JavaScript?
- How to specify citation in HTML?
- Specify the background image with CSS
- How to use an animated image in HTML page?
Advertisements