HTML CSS JS 4

1-4 목록 태그

안녕하세요. 이번 포스팅에서는 HTML에서 목록(List)을 만들 때 사용하는 ul, ol, li 태그를 정리해보았습니다. 웹페이지를 만들다 보면 메뉴 목록, 순서가 있는 설명, 체크리스트 등 여러 개의 항목을 나열해야 하는 경우가 있습니다.이럴 때 단순히 줄바꿈으로 작성하는 것이 아니라 HTML의 목록 태그를 사용하면 구조를 더 명확하게 표현할 수 있습니다. 처음에는 ul, ol, li가 비슷학세 보여 헷갈릴 수 있지만 각각의 역할을 이해하면 상황에 맞게 사용할 수 있습니다. 학습 목표웹 페이지에서는 메뉴, 게시판, 카테고리, 검색 결과 등 여러 정보를 목록 형태로 보여주는 경우가 많습니다. 이번 포스팅에서는 HTML의 목록 태그인 ul, ol, li를 사용하여 정보를 구조적으로 표현하는 방법을 익..

HTML CSS JS 2026.06.04

1-3 HTML 자주 쓰는 태그

안녕하세요 이번 포스팅에서는 HTML을 배울 때 가장 먼저 만나게 되는 태그들을정리해 보았습니다. 웹 페이지는 단순히 글자를 나열하는 게 아니라, 태그를 통해 각 요소의 역할과 위치를 브라우저에게 알려주는 것이 핵심입니다. 처음에는 태그 종류가 많아서 막막하게 느껴질 수 있지만, 오늘 소개하는 7가지 태그를 잘 익혀두면 기본적인 웹 페이지 구조는 충분히 만들 수 있습니다. 학습 목표웹 페이지를 만들 때는 제목인지 · 본문인지 · 특정 영역인지 구조를 구분해야 합니다. 이번 포스팅에서는 가장 기본이 되는 HTML 태그들을 통해 웹 페이지의 구조를 나누는 방법을 익혀보겠습니다. 텍스트 구조를 잡아주는 태그 (h1~h6, p) 를 이해한다영역을 나누는 태그 (div, span) 의 차이를 이해한다줄바꿈과 ..

HTML CSS JS 2026.05.26

1-2 기본 문서 구조

안녕하세요. 이번 포스팅에서는 HTML을 처음 배울 때 가장 먼저 마주치게 되는 기본 문서 구조에 대해 알아보겠습니다.HTML 파일을 새로 만들 때마다 매번 등장하는 , , 여기는 웹페이지에 표시할 콘텐츠(태그)를 입력합니다. HTML의 기본 문서 구조는 , , , , , 총 6가지로 이루어져 있습니다. 하나씩 살펴보도록 합시다. 문서 형식 선언, 문서 맨 첫 줄에 오는 이 선언은 "이 파일은 HTML5로 작성됐습니다" 라고 브라우저에게 알려주는 역할입니다. 태그처럼 생겼지만 태그는 아니고, 일종의 선언문입니다. 문서의 시작과 끝, 선언 다음에 오는 태그가 실제 문서의 시작입니다. 여는 태그부터 닫는 태그 사이에 모든 내용이 들어갑니다.lang="ko" 속성은 "이 문서의 주요 언어는 한국..

HTML CSS JS 2026.04.29

1-1. HTML 역할 이해

안녕하세요. 오늘은 HTML 학습의 첫 번째 단계로, HTML이 무엇이고 어떤 역할을 하는지 알아보겠습니다.태그를 배우기 전에, 먼저 HTML을 바라보는 올바른 관점부터 잡아보겠습니다. HTML이란?HTML은 HyperTextMarkupLanguage의 약자입니다.모든 웹사이트의 가장 기본적인 구성 요소 HTML은, 웹페이지의 구조를 정의하는 마크업 언어 입니다. 각 단어의 의미를 풀어보면 이렇습니다.Hyper Text(하이퍼텍스트): 링크를 통해 다른 페이지로 이동할 수 있는 텍스트Markup(마크업): 콘텐츠에 "이건 제목이야","이건 단락이야" 같은 의미와 역할을 표시(태그)하는 방식Language(언어): 브라우저가 이해할 수 있는 약속된 문법 체계즉, HTML은 브라우저에게 "이 내용은 제목이..

HTML CSS JS 2026.04.23