Computer Science/HTML

[HTML] 개념노트 4편 링크 태그 <a> 이해하기

HTML 개념노트 4편링크 태그 이해하기웹페이지에서 다른 페이지로 이동하게 만드는 가장 기본적인 태그가 바로 태그입니다. 이번 글에서는 링크 태그의 기본 사용법과 자주 쓰는 속성을 정리해 보겠습니다.1. 링크 태그란? 태그는 anchor의 약자로, 사용자가 클릭했을 때 다른 페이지나 특정 위치로 이동할 수 있게 해주는 태그입니다.블로그 글에서 다른 글로 이동하거나, 메뉴를 클릭해서 페이지를 바꾸거나, 외부 사이트로 연결할 때 모두 링크 태그를 사용할 수 있습니다.구글로 이동하기쉽게 말하면? 태그는 웹페이지 안에 있는 “문” 같은 역할을 합니다. 사용자가 클릭하면 다른 방, 다른 페이지, 다른 사이트로 이동할 수 있습니다.2. href 속성링크 태그에서 가장 중요한 속성은 href입니다. href는 이..

[HTML] 개념노트 3편 제목, 문단, 줄바꿈 태그 이해하기

HTML 개념노트 3편제목, 문단, 줄바꿈 태그 이해하기웹페이지에서 가장 많이 사용하는 기본 태그는 제목과 문단 태그입니다. 이번 글에서는 ~, , 태그를 정리해 보겠습니다.1. 제목 태그란?HTML에서 제목을 만들 때는 heading 태그를 사용합니다. heading 태그는 부터 까지 있습니다.숫자가 작을수록 더 중요한 제목이고, 숫자가 클수록 하위 제목입니다.가장 중요한 제목두 번째로 중요한 제목세 번째 제목네 번째 제목다섯 번째 제목여섯 번째 제목쉽게 말하면?은 책 제목, 는 큰 단원 제목, 는 소단원 제목처럼 생각하면 됩니다.2. h1부터 h6까지의 차이태그역할사용 예시페이지의 가장 큰 제목블로그 글 제목, 서비스 이름큰 주제 제목1장, 2장, 주요 섹션하위 주제 제목세부 설명 제목~더 작은 하..

[HTML] 개념노트 2편 HTML 문서 기본 구조 이해하기

HTML 개념노트 2편HTML 문서 기본 구조 이해하기HTML을 제대로 작성하려면 먼저 문서의 기본 뼈대를 알아야 합니다. 이번 글에서는 DOCTYPE, html, head, body가 각각 어떤 역할을 하는지 정리해 보겠습니다.1. HTML 문서 기본 구조HTML 문서는 아무 태그나 막 적는 것이 아니라, 기본적인 구조를 가지고 있습니다. 가장 기본적인 HTML 문서 형태는 아래와 같습니다. 안녕하세요 HTML 문서 구조를 배우고 있습니다. 처음 보면 코드가 길어 보일 수 있지만, 크게 보면 구조는 단순합니다. 문서 선언, 문서 전체 영역, 문서 정보 영역, 화면 출력 영역으로 나눌 수 있습니다.2. 이란?은 이 문서가 HTML5 문서라는 것을 브라우저에게 알려주는 선언입니다.쉽게..

[HTML] 개념노트 1편 HTML이란? 웹페이지의 뼈대 이해하기

HTML 개념노트 1편HTML이란? 웹페이지의 뼈대 이해하기웹 개발을 처음 배울 때 가장 먼저 만나는 기술이 HTML입니다. HTML은 어렵게 생각할 필요 없이, 웹페이지의 구조를 만드는 언어라고 이해하면 됩니다.1. HTML은 무엇인가요?HTML은 HyperText Markup Language의 약자입니다. 우리말로 풀어보면 웹페이지에 글, 이미지, 버튼, 링크 같은 요소를 배치하기 위한 마크업 언어입니다.여기서 중요한 점은 HTML이 프로그래밍 언어라기보다는 문서의 구조를 설명하는 언어에 가깝다는 것입니다.쉽게 말하면?HTML은 웹페이지의 뼈대입니다. CSS는 옷과 디자인이고, JavaScript는 움직임과 기능이라고 보면 됩니다.2. HTML이 필요한 이유웹 브라우저는 우리가 작성한 HTML 코드를..