JSFiddle - React, Tailwind, and code Playground

by erikamac

HTML

<figure class="foto-legenda">
  <img src="https://images.pexels.com/photos/67636/rose-blue-flower-rose-blooms-67636.jpeg?auto=compress&cs=tinysrgb&h=350">
  <figcaption>
    <h3>Google Glass</h3>
    <p>Uma nova maneira de ver o mundo></p>
  </figcaption>
</figure>

CSS

@charset "UTF-8";
body {
  background-color: gray;
  color: rgba(0, 0, 0, 0.7);
}

p {
  text-align: justify;
  text-indent: 50px;
}


/*formatação imagens*/

figure.foto-legenda {
  border: 8px solid red;
}

figure.foto-legenda img {
  width:100%;
  height:100%;
}