웹프로그래밍 HTML (5) 컨테이너요소

📋오늘의 목표📋

문서,텍스트,앵커,컨테이너요소에 대해서 알아보자

📕 컨테이너 요소

📖<div>태그

박스형태로 묶어진다.

<div width="500">
    내용
</div>

• width, height 크기 지정이 가능하다.

📖<span>태그

줄단위의 영역이다.

<span>내용</span> 

📖<section> 태그

독립적인 내용을 분리하고 그룹화할 때 사용한다. 재사용할 수 있다.

<section>내용</section> 

📖<article> 태그

논리적으로 관계있는 요소,문서를 분리할 때 사용한다.

<article>내용</article> 

✍️예시코드

<section>
  <h1>HOT TOPIC</h1>
  <section>
     <p>World</p>
     <article>World news 1</article>
     <article>World news 2</article>
     <article>World news 3</article>
  </section>
  <section>
    <p>Sport</p>
    <article>Sport news 1</article>
    <article>Sport news 2</article>
    <article>Sport news 3</article>
  </section>
</section>

👉실행화면

HOT TOPIC

World

World news 1 World news 2 World news 3

Sport

Sport news 1 Sport news 2 Sport news 3

🏅오늘의 느낀점🏅

주요 태그들에 대해서 알아보았는데 <h1> <p> <br> <div> <span> 태그들에 대해서 잘 알고 있어야 할 것 같다.
그리고 이 페이지에만 너무 많은 내용이 있어서 좀 나눌까 고민중이다.