Slide 6
Slide 6 text
The HTML:
The CSS:
img {
max-width: 100%;
height: auto;
}
!
The CSS:
img {
max-width: 100%;
height: auto;
}
!
Slide 7
Slide 7 text
The HTML:
The CSS:
img {
max-width: 100%;
height: auto;
}
"
The CSS:
img {
max-width: 100%;
height: auto;
}
"
Slide 13
Slide 13 text
The HTML:
Slide 18
Slide 18 text
The HTML:
Slide 34
Slide 34 text
The new HTML:
$
$
Slide 38
Slide 38 text
The HTML:
Slide 46
Slide 46 text
The HTML:
Slide 50
Slide 50 text
The HTML:
$
$
Slide 53
Slide 53 text
Default way to add an image:
Generates standard image HTML:
Slide 55
Slide 55 text
An image with the jekyll-cloudinary plugin:
{% cloudinary image.jpg alt="…" %}
Generates responsive image HTML with ![]()
and
srcset.
You just have to define presets for:
- The minimum and maximum widths
- The number of sizes to generate
- The layout with the sizes attribute