HTML 마크업 연습하기

<section class="news">
  <h2 class="news-heading">
    새소식
  </h2>
  <a href="#" class="news-link">
    <dl class="news-list">
      <dt class="news-title">
        <span>W3C 사이트가 리뉴얼 되었습니다.</span>
        <time datetime="2018-05-31T13:53:45">2018.05.31</time>
      </dt>
      <dd class="news-description">
        디자인 및 다양한 view 환경을 고려하여 구성되어 있으며, 기존보다 최신 정보 및 개발자를 위한 기술 가이드도 찾기 쉽도록 구성되어 있습니다.
      </dd>
    </dl>
    <figure class="news-thumbnail">
      <img class="news-thumbnail-image" src="./images/news.gif" alt="W3C 리뉴얼">
      <figcation class="news-thumbnail-title">W3C 리뉴얼</figcation>
    </figure>
  </a>
  <a href="#" class="icon-plus news-more" title="새소식 더보기" aria-labelledby="news-link">더보기</a>
</section>

webcafe.html 부분 새소식 영역 마크업 및 html 구성