HTML에서 줄바꿈이 안 될 때? br 태그 하나로 해결하세요!

HTML 줄바꿈을 설명하는 비버 마스코트 썸네일 이미지

HTML에서 줄바꿈이 필요할 때 쓰는 태그, <br> 완전정복! 텍스트를 예쁘게 정리해 보여주고 싶었는데, 화면에서는 줄이 이어져 나와 당황해본 적 있으신가요? HTML에서는 우리가 엔터키를 눌러 줄을 바꿨다고 해서 그대로 표현되지 않아요. 이때 등장하는 게 바로 오늘의 주인공 <br> 태그입니다. 단순하지만, 알아두면 HTML 글쓰기가 훨씬 자연스러워져요! Step 1. <br> 태그는 어떤 역할을 할까? <br>은 break line의 줄임말로, … 더 읽기

article 태그, HTML 콘텐츠를 더 똑똑하게 나누는 법

article 태그, 독립된 콘텐츠의 주인공

독립된 콘텐츠 단위를 표현하는 <article> 태그 완전정복 1. <article> 태그란? <article> 태그는 블로그 글, 뉴스 기사, 게시판 글 등 **독립적으로 의미를 갖는 콘텐츠**를 담을 때 사용합니다. RSS 피드나 공유 기능을 통해 따로 떼어 보여줘도 완결성이 있는 콘텐츠일 때 주로 사용돼요. 즉, 페이지 안에서 ‘하나의 글’, ‘하나의 게시물’을 담당한다고 생각하면 됩니다. 검색엔진에게도 이 영역이 하나의 정보 … 더 읽기

형광펜 효과 내는 HTML mark 태그, 제대로 써보자

HTML mark 태그를 설명하는 선글라스 낀 시크한 비버 캐릭터가 키보드를 두드리는 일러스트 썸네일 이미지

HTML mark 태그 완전 정리 HTML mark 태그 완전 정리 – 의미 있는 형광펜 강조 웹 문서에서 특정 부분을 돋보이게 만들고 싶을 때 어떻게 하나요? 그냥 굵게만? 아니죠. 오늘은 독자의 시선을 사로잡는 비장의 무기, mark 태그를 제대로 살펴보겠습니다. 단순히 색칠하는 게 아니라, 의미 중심의 강조 태그라는 점에서 매우 유용합니다. 예제 1. 텍스트의 특정 부분 강조하기 … 더 읽기

HTML 기본 구조 이대로 외우세요 – head, body, html 딱 정리했습니다

시크한 헤어스타일과 검정 선글라스를 쓴 비버가 키보드를 두드리며 HTML 코딩을 하는 모습

HTML 문서 구조란? HTML 태그는 아는데, 어디에 써야 할지 막막하다면 처음 HTML을 배우면 태그 하나하나는 익히기 쉬운데, 막상 페이지를 만들려 하면 뭐부터 써야 할지 막막해진다. 이럴 땐 문서 구조가 머릿속에 없기 때문이다. 건축으로 치면 설계도 없이 벽돌부터 쌓으려는 것과 비슷하다. 이 글에서는 HTML 문서의 기본 구조를 실제 웹사이트처럼 구성해보며, 태그들이 어디에 어떻게 들어가는지를 입체적으로 다뤄본다. … 더 읽기