Untitled

avatar
unknown
plain_text
a year ago
1.3 kB
10
Indexable
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Daily Challenge</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <h2>Collapsible Content</h2>
    <details>
        <summary>
          click to reveal
        </summary>
        <p>
          stuff
        </p>
        </details>

        <h2>responsive images</h2>

        <img src="../../resources/images/halo.jpg" alt="halo" class="responsive">

        <h2>scalar measurments</h2>

        <label for="disk_c">Disk usage C:</label>
        <meter id="disk_c" value="2" min="0" max="10">2 out of 10</meter><br>

        <label for="disk_d">Disk usage D:</label>
        <meter id="disk_d" value="0.6">60%</meter>

        <h2>progress indicators</h2>

        <label for="file">File progress:</label>
        <progress id="file" max="100" value="70">70%</progress>

        <div aria-busy="true" aria-describedby="progress-bar">
            <!-- content is for this region is loading -->
          </div>
          
          <!-- no CSS! -->
          <p>Loading</p>
          <progress id="progress-bar" aria-label="Content loading…"></progress>

</body>
</html>

<!-- .responsive {
    width: 50%;
    height: auto;
  } -->
Editor is loading...
Leave a Comment