인라인 요소 -> 글자를 만들기 위한 요소들

        대표적인 인라인 요소는 span태그
        인라인 요소는 수평으로 쌓이는 특징
        span 태그는 콘텐츠 영역을 설정하는 용도, 하나의 글자
        인라인 요소는 줄바꿈을 하여 코드를 작성하면, 중간에 띄어쓰기가 들어감
        줄바꿈을 하지 않으면 띄어쓰기는 없음
        가로사이즈와 세로사이즈(높이)는 포함한 콘텐츠 크기만큼 자동으로 줄어듬
        글자 요소는 가로 세로 사이즈를 지정할 수 없음
        글자 요소는 여백(margin, padding)을 추가할 때 위와 아래의 여백은 적용되지 않음
        인라인 요소는 자식 요소로 블록 요소를 사용할 수 없음
        자식 요소로 인라인 요소를 사용할 수 있음

블록 요소 -> 상자(레이아웃)를 만들기 위한 요소들

        대표적인 요소는 div 태그
        div 태그는 콘텐츠의 영역을 설정하는 용도
        블록 요소는 위에서 아래로, 수직으로 쌓이는 특징
        부모 요소의 크기만큼 자동으로 늘어남
        온전하게 가로와 세로 너비를 사용할 수 있음
        온전하게 여백 요소(위,아래, 외부, 내부)를 사용할 수 있음
        블록 요소는 자식으로 블록 요소를 사용할 수 있음
        자식 요소로 인라인 요소를 사용할 수 있음

인라인-블록요소 -> 글자 요소이기는 하나 상자 요소가 가지고 있는 몇가지 특성을 사용 가능함

        대표적인 요소는 input태그
        수평으로 쌓이는 특징(인라인 요소), 가로세로값과 여백을 지정할 수 있음(블록요소)