HTML의 컨테이너 태그와 전역 속성

이번 시간은 컨테이너 태그와 전역 속성에 대해 "간단하게" 알아보도록 하자.

이 두 가지는 워낙 많은 곳에서 쓰이기 때문에 개별적으로 설명하기에는 애매하다.

따라서 이번 포스팅은 이런것들이 있구나 하고 넘어가고 잘 기억하고 있다가 다음에 짚고 넘어가겠다.

 

우선 컨테이너 태그부터 알아보자

 

컨테이너 태그란 무엇일까?

- 컨텐츠나 레이아웃에 아무런 형향을 주지않고 다른 요소 여럿을 묶어 
  관리하기 편하게 만드는 역할을 하는 태그를 컨테이너 태그라고 한다.
- 컨텐츠를 구분하거나 공통적인 스타일을 적용하고자 할때 개발자는 컨테이너를 사용한다.

 

이 컨테이너 태그는 두 가지 레벨 속성을 갖는데 이제는 익숙한 블럭 레벨 속성과, 인라인 레벨 속성이다.

 

-블럭 레벨(block-level) 요소
 : 자기가 속한 영역의 너비를 모두 차지하여 블록을 형성한다.

-인라인 레벨(inline-level) 요소
 : 자기에게 필요한 만큼의 공간만 차지한다.

 

위의 각 요소들을 대표하는 태그가 바로 div 태그와 span 태그이다.

 

-<div></div> : 블럭 레벨 컨테이너
-<span></span> : 인라인 레벨 컨테이너

 

 

 

 

자 이렇게 컨테이너 요소에 대해 알아보았고 이번에는 전역 속성에 대해 알아보자.

 

전역 속성 (Global attributes)이란 무엇일까?

- 전역속성은 모든 HTML 태그에서 공통을 사용하는 태그이다.
- 속성이란 태그의 부가적인 기능을 정의하는 것으로 선택사항이다.
- 속성은 시작 태그의 내부에 정의한다.
- 속성의 개수에는 제한이 없다.

 

<태그명 property="value"  property="value">컨텐츠</태그명>

위 처럼 기본적으로 태그명 뒤에 속성=속성값을 넣어준다.

 

다음으로 대표적인 전역 속성을 소개하고 이번 포스팅은 마치도록 하겠다.

대표적인 전역 속성

- id : 요소에 고유한 이름을 부여하는 식별자 역할 속성
- class : 요소를 그룹별로 묶을수 있는 식별자 역할 속성
- style : 요소에 적용할 CSS 스타일을 선언하는 속성
- title : 요소의 추가 정보를 제공하는 텍스트 속성 (사용자에게 툴팁을 제공)

 

자 이렇게 컨테이너 태그와 전역 속성에 대해 알아봤는데

오늘 포스팅을 대충 한 것 같지만 예시를 보이려면 내용이 너무 방대해져서 추후에 다른 태그들과 함께 써보도록 하겠다.