전체 글 21

HTML - 섹션과 메인 요소

섹션을 나누는 요소들은 흔히 시멘틱 태그라고 해서 HTML문서에 구조적인 의미를 줄 수 있는 태그들을 말한다. 도 비슷한 역할을 하지만 아무 의미가 없는 태그기 때문에 구조적인 의미를 갖고 있지 않아 성격적으로 다르다.  : 머리말 (로고, 사이트 소개, 내비게이션 포함 가능) : 내비게이션 (메뉴) : 문서의 주요 콘텐츠 : 주제별 콘텐츠 구분 : 독립적인 콘텐츠 (블로그 글, 뉴스 기사 등) : 부가 정보 (사이드바, 광고 등) : 바닥글 (저작권, 연락처 등) 간단한 예시로 살펴보면 아래와 같이 사용할 수 있다.본문 헤더내비게이션 섹션 헤더 ... 섹션 푸터 섹션 헤더 ... 섹션 푸터 부가 콘텐츠본문 푸터 위 사진은 컨테이너 요소와 섹션 요소의 차이점을..

Coding/HTML & CSS 2025.02.26

HTML - 컨테이너 요소

HTML의 컨테이너 요소는 레이아웃을 구성하고 스타일이나 스크립트를 적용하기 위해 그룹화하기 위해 사용하는 요소이다.  : division 아무런 의미를 갖고 있지 않는 태그다. 블록 레벨 요소를 가지고 레이아웃을 나누는 데 사용된다. : div와 동일하게 아무런 의미를 갖지 않는 태그다. 인라인 레벨 요소를 가지고 텍스트나 다른 인라인 요소를 꾸미기 위해 사용한다. 블록 컨테이너 요소 div는 블럭 레벨 요소로 레이아웃을 나누기 위해 사용합니다. 예제에서는 두개로 나눠진 레이아웃을 확인 할 수 있습니다. 인라인 컨테이너 요소 AI 코딩도구 윈드 서퍼 커서 코파일럿 , , , , , , 도 컨테이너 요소로 사용한..

Coding/HTML & CSS 2025.02.26

HTML - table 요소

은 행과 열을 나타내기 위한 마크업 요소이다.기본 자식요소로 를 갖는다.  : 테이블의 제목을 담당 : table row 테이블의 행을 의미 : table header 테이블 셀의 제목 : table data 테이블 행에 들어가는 내용 위 내용을 토대로 테이블을 만들어보면 이렇게 된다. 테이블 제목 셀 제목1 셀 제목2 셀 제목3 셀 제목4 셀 내용1 셀 내용2 셀 내용3 셀 내용4 셀 내용5 셀 내용6 셀 내용7 셀 내용8  HTML에서 표를 그리..

Coding/HTML & CSS 2025.02.26