CODING FACTORY
  • HTML
  • CSS
  • JavaScript
  • jQuery
  • Python
  • MariaDB
  • 잡동사니
  • Deutsch
  • English
  • Español (España)
  • Français
  • Bahasa Indonesia
  • Italiano
  • 日本語
  • 한국어
  • Português (Brasil)
  • 简体中文
  • Deutsch
  • English
  • Español (España)
  • Français
  • Bahasa Indonesia
  • Italiano
  • 日本語
  • 한국어
  • Português (Brasil)
  • 简体中文
  • HTML
  • CSS
  • JavaScript
  • jQuery
  • Python
  • MariaDB
  • 잡동사니

카테고리: HTML Reference

짧은 항목에서 긴 설명 말풍선이 펼쳐지는 일러스트

HTML abbr 태그: 약어 뜻 표시와 title 속성 사용법

abbr로 약어를 표시하고 전체 이름을 설명하는 방법을 알아봅니다. title 툴팁의 역할과 한계, 모바일·키보드 사용자에게도 뜻을 전달하는 작성 방법을 예제로 비교합니다.

보이는 입력창 뒤에 숨은 값 카드가 함께 전달되는 일러스트

HTML hidden 입력: 숨은 값 전송과 보안상 주의점

hidden 입력의 name·value와 폼 전송 조건을 실행 예제로 확인합니다. disabled·CSS 숨김과의 차이, 값 변경 가능성, 실제 서버에서 검증해야 할 항목을 설명합니다.

여러 줄의 입력 내용을 담은 넓은 텍스트 영역 일러스트

HTML textarea 태그: 여러 줄 입력·초기값·크기와 길이 제한

textarea의 rows·cols와 입력 길이 제한을 구분하고, 초기값·줄바꿈·초기화 동작을 전체 예제로 확인합니다. readonly와 disabled의 전송 차이, JavaScript와 서버에서 값을 다루는 주의점도 설명합니다.

한 줄의 내용이 다음 줄로 이어지는 흐름을 표현한 일러스트

HTML br 태그: 줄바꿈 방법과 p·wbr·pre의 차이

br이 삽입하는 줄바꿈과 소스 코드의 줄바꿈을 전체 예제로 비교합니다. p·wbr·pre의 선택 기준과 문단 간격을 margin으로 조절해야 하는 이유도 설명합니다.

  • 이전 페이지
  • 1
  • 2
  • 3
HTML 강좌
  • 시작하기
    • 개념과 역할
    • HTML 문서의 기본 구조
    • 문법
  • 콘텐츠 작성하기
    • 제목과 문단
    • 텍스트에 의미 부여하기
    • 목록
    • 링크
    • 이미지
    • 반응형 이미지
  • 페이지 구조 만들기
    • 시맨틱 요소로 페이지 영역 나누기
    • div와 span은 언제 사용할까?
    • 그림과 설명 묶기
    • 표 만들기
    • 읽기 쉬운 표 만들기
  • 입력 양식 만들기
    • form의 구조와 GET·POST 제출 방식
    • label과 input으로 입력 필드 만들기
    • input 유형 선택하기
    • textarea, select, option, button 사용하기
    • 입력값 검증
    • fieldset, legend, autocomplete로 양식 설명하기
    • 양식에 안내 문구 추가하기
  • 문서를 완성하고 점검하기
    • 문서 제목·설명·언어·문자 인코딩 설정하기
    • 미디어와 외부 콘텐츠 삽입하기
    • details와 summary로 펼침 콘텐츠 만들기
    • HTML 접근성 기본
    • HTML 오류 찾기와 문서 검사하기
    • 여러 페이지로 된 작은 사이트 만들기
홈

© 2026 CODING FACTORY

RSS