figure tag

 



  • The figure element is particularly useful for images, illustrations, diagrams, videos, audio clips, and other types of media.
  • Use the alt attribute for images within the figure element to provide alternative text for accessibility.
  • The figure element helps improve accessibility and search engine optimization by indicating the content and its context.

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
        @import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&family=Urbanist:wght@300;400;600;700;800;900&display=swap");

        html {
            font-family: "jost", sans-serif;
            background-color: #efefef;
        }

        h1 {
            font-weight: bold;
        }

        img {
            box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
            border-radius: 8px;
        }
    </style>
</head>

<body>
    <h1>HTML FIGURE TAG</h1>
    <p>
        Lorem ipsum dolor sit amet consectetur adipisicing elit. Nostrum nihil magni illum. Ullam delectus cum corporis
        illo suscipit est excepturi eveniet blanditiis dicta officia, mollitia fugit saepe temporibus nesciunt
        quibusdam!
    </p>
    <!-- add figure tag here  -->
    <figure>
        <img src="../images/E3CCA633-C689-4DD9-8B20-79E7C5A88487.jpg" alt="my image" width="500" height="auto" />
        <figcaption>This is my image</figcaption>
    </figure>
    <p>
        Lorem ipsum dolor sit amet consectetur adipisicing elit. Eaque dignissimos repellendus libero odio delectus
        quisquam a in, at quos vitae deserunt ipsam non odit maiores quis? Ea vitae officiis impedit.
    </p>
</body>

</html>


Related Posts:

  • Textarea & Select Textarea ElementThe textarea element is used when you need multiline text input from the user. This is particularly useful for comment… Read More
  • HTML Introduction  What is HTML5?HTML stands for Hypertext Markup LanguageHypertext is Text which contains links to other textsmarkup language it's a way to … Read More
  • HTML FormsThe <form> tag is used to create an HTML form for user input.The <input> HTML element is used to create interactive controls for web-based… Read More
  • HTML Working How do websites work?When a user sends a request to a server by typing  (www.devjunctionpoint.blogspot.com) on the internet or browseryour … Read More
  • More on forms Common AttributesactionThe action attribute specifies the URL where the form data should be sent after submission.<form action="/su… Read More

0 Comments:

Post a Comment

Do leave your comments