Prawidłowe odpowiedzi do zadań

<h1>The main theme of the web page in the h1 header.</h1>

<!-- The commentary answers the question "Why is this part of the code written". -->

<img src="/photo.jpg" alt="Image example" width="200" height="150" />

<ul>
  <li>HTML</li>
  <li>CSS</li>
  <li>JavaScript</li>
</ul>

<div class="buttons">
  <button type="button" class="button">inline</button>
  <button type="button" class="button">block</button>
  <button type="button" class="button">inline-block</button>
</div>

<div class="buttons">
  <button type="button" class="button">HTML</button>
  <button type="button" class="button">CSS</button>
  <button type="button" class="button">JavaScript</button>
</div>

<div class="box">
  <a class="link-inline" href="#"><span>Text</span></a> without line break
</div>
<div class="box">
  <a class="link-block" href="#"><p>Text</p></a> with line break
</div>

<div class="card">
  <h4 class="card-title">The order in which files are loaded by the browser</h4>
  <ol class="card-items">
    <li class="card-item">HTML file</li>
    <li class="card-item">Link to files inside head</li>
    <li class="card-item">Link to files inside body</li>
  </ol>
</div>

<ul class="cards">
  <li class="card">
    <h4 class="card-title">Card title 1</h4>
    <div class="wrp-img">
      <img
        class="card-image"
        src="https://ac.goit.global/img/photo1.jpg"
        alt="image description"
      />
    </div>
    <p class="card-description">Description of the topic 1</p>
  </li>
  <li class="card">
    <h4 class="card-title">Card title 2</h4>
    <div class="wrp-img">
      <img
        class="card-image"
        src="https://ac.goit.global/img/photo2.jpg"
        alt="image description"
      />
    </div>
    <p class="card-description">Description of the topic 2</p>
  </li>
  <li class="card">
    <h4 class="card-title">Card title 3</h4>
    <div class="wrp-img">
      <img
        class="card-image"
        src="https://ac.goit.global/img/photo3.jpg"
        alt="image description"
      />
    </div>
    <p class="card-description">Description of the topic 3</p>
  </li>
</ul>

<a
  href="https://goit.global"
  target="_blank"
  rel="noopener nofollow noreferrer"
>
  GoIT
</a>

<a href="resume.pdf" download>Resume</a>

<!-- Link to phone number -->
<a href="tel:+14251234563">+1 (425) 123-45-63</a>
<!-- Link to e-mail address  -->
<a href="mailto:example@gmail.com">example@gmail.com</a>

<header id="top">
  <!-- content from logo, nav, search  -->
</header>
<main>
  <aside>
    <ul>
      <li><a href="#top">Top of the page</a></li>
      <li><a href="#page-theme">Main theme</a></li>
      <li><a href="#bottom">Footer of the page</a></li>
    </ul>
  </aside>
  <article id="page-theme">
    <!-- main page theme  -->
  </article>
</main>
<footer id="bottom">
  <!-- content from logo, nav, contacts, copyright  -->
</footer>

<figure>
  <img src="https://ac.goit.global/img/photo1.jpg" alt="photo description" />
  <figcaption>
    Only one img element and any number of text or other elements can be used
    inside link. You cannot use interactive elements inside link tag.
  </figcaption>
</figure>

<a class="link" target="_blank" href="https://goit.global">
  <img src="https://ac.goit.global/img/photo1.jpg" alt="note in laptop" />
</a>
<a class="link" target="_blank" href="https://goit.global">
  <img src="https://ac.goit.global/img/photo2.jpg" alt="note on paper" />
</a>

<!--  TODO
* create project with the following structure:
images/logo.svg
css/style.css
about.html
index.html
 -->

<img src="https://ac.goit.global/img/html-css.png" alt="logo" />

Prawidłowe odpowiedzi do zadań

Prawidłowe odpowiedzi do zadań​

Prawidłowe odpowiedzi do zadań