HTML 요소의 블록, 인라인, 인라인-블록 차이

block 요소블록 요소는 부모 요소의 전체 공간을 차지하여 블록을 만드는 요소다.좌우 양측으로 최대한 늘어나 가능한 모든 너비를 차지한다.줄바꿈이 일어난다.페이지의 구조적 요소를 나타낼 때 사용한다.블록 요소는 인라인 요소 안에 중첩 될 수 없지만 a태그는 블록 요소 중첩이 가능하다.(특이 케이스)inline 요소인라인 요소는 항상 블록 레벨 요소에 포함된다.콘텐츠에 따라 할당된 공간만 차지한다.width, height 크기 지정을 할 수 없다.padding, border, margin(left, right) 속성을 사용할 수 있지만, 상하 margin 속성은 사용할 수 없다.줄바꿈이 일어나지 않는다.inline-block 요소기본적으로 인라인 요소 속성을 따르면서 width, height 크기를 지..

• format_list_bulleted 프론트엔드/HTML
• · 2025. 5. 29.
• textsms

시멘틱 태그

HTML의 시멘틱 태그는 문서의 구조와 의미를 명확하게 나타내기 위해 사용되는 태그다.이 규칙을 잘 지키면 웹접근성이 향상되고, SEO를 강화할 수 있다. 태그의미사용 예시 또는 설명문서나 섹션의 머리말 영역로고, 네비게이션, 제목 등이 위치함내비게이션 링크 영역메뉴, 링크 목록 등문서의 주요 콘텐츠페이지의 핵심 내용문서 내 주제별 구분 영역뉴스, 블로그 글 등 주제 단위로 콘텐츠 구분독립적인 콘텐츠 영역블로그 글, 기사, 포럼 글 등 단독으로 사용 가능한 콘텐츠보조 콘텐츠 영역광고, 관련 글, 사이드바 등문서나 섹션의 바닥글 영역저작권 정보, 연락처, 사이트 링크 등삽입된 이미지, 도표, 코드 등의 그룹화이미지와 캡션을 묶을 때 사용의 설명 또는 캡션이미지나 도표에 대한 설명 텍스트강조 표시형광펜처럼 ..

• format_list_bulleted 프론트엔드/HTML
• · 2025. 5. 28.
• textsms