From the course: Responsive Images
Unlock the full course today
Join today to access over 22,400 courses taught by industry experts or purchase this course individually.
New attributes and terminology for responsive images - CSS Tutorial
From the course: Responsive Images
New attributes and terminology for responsive images
- The introduction of responsive images brings with it some new terminology. So, before we dive deeper, let me quickly introduce you to our new friends. srcset, width descriptor, pixel density descriptor, sizes, and the element and get a basic understanding of what each of them does. In a traditional img tag, we have the obligatory src, or S-R-C, attribute that provides the URL to the image file to be displayed. In responsive images, we also have a new attribute called srcset, or S-R-C set. The srcset attribute allows us to provide a comma separated list, of one or more URLs to images the user agent or browser can choose from. The browser chooses the best suited image file from the list and effectively replaces the original source URL with a new one from the srcset list. Within the srcset attribute, we can add either, a width descriptor, or a pixel density descriptor to each of the listed URLs. The width descriptor is used to provide the browser with the actual width of an image file…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.