Adding call-to-action text to carousel images

It's often useful to include some promotional, or call-to-action (CTA), text with each slide of a hero slide carousel. Recall that only direct children of amp-carousel are carousel items, so any child tags of a carousel item are associated with that item. In our carousel code so far, each a tag is a carousel item, so we could add the caption like this:

<a href="#">  <amp-img src="img/tshirt-banner-1280.jpg" width="640" height="300" layout="responsive"></amp-img>  <div class="caption">T-SHIRT SALE 50% OFF</div></a>

But we can do better. This is a perfect chance to use the amp-fit-text component we saw in Chapter 3, Making an Impression: Layout and Page Design in AMP. Recall that amp-fit-text will ...

Get AMP: Building Accelerated Mobile Pages now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.