Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |
Tags
- figma
- vscode
- threejs
- DM
- C++
- mongo
- Git
- postgresql
- CV
- DB
- SOLID
- html
- frontend
- review
- js
- PRISMA
- sqlite
- UI
- python
- Express
- GAN
- react
- Linux
- API
- ps
- ML
- PyTorch
- nodejs
- ts
- CSS
Archives
- Today
- Total
아카이브
[HTML] HTML 태그와 속성 정리 본문
HTML의 태그는 요소(element)의 종류를 나타내며, 그 용도에 따라 다양하게 존재합니다.
일반적으로 태그를 사용할 때는 다음과 같은 문법을 따릅니다.
<element attribute="value"> content </element>
태그 | 용도 |
html | html 전체 |
head | 헤더 |
title | 페이지 제목. 브라우저 탭에 나타나는 이름 |
body | 본문 |
div | 구역 구분 |
p | 문단 구분 title: 툴팁 (텍스트에 마우스 대면 나오는 설명) |
span | 문단 내 영역 구분 |
a | 링크. href 또는 자체 페이지의 앵커로 이동 href : 웹 페이지 url |
img / | 이미지 출력 (닫는 태그 없음) src : 이미지 이름 (확장자 포함) alt : 대체 이름 width : 너비 height : 높이 |
br / | 줄바꿈 (닫는 태그 없음) |
hr | 가로선 긋기 |
h1 ~ h6 | 소제목 |
ul | 순서 없는 글머리 |
ol | 순서 있는 글머리 |
li | 목록 내용. ul 또는 ol 내에서 사용 |
dl | 설명 목록 |
dt | 설명 제목. dl 내에서 사용 |
dd | 설명 내용. dl 내에서 사용 |
table | 표 border : 테두리 두께 (숫자) |
caption | 표의 캡션 설명. table 내에서 사용 |
thead | 표의 첫번째 행. table 내에서 하나만 사용 |
tbody | 표의 본문. table 내에서 사용 |
tfoot | 표의 마지막 행. table 내에서 하나만 사용 |
tr | 표의 행(raw). thead / tbody / tfoot 내에서 사용 |
th | 헤더 열(column). 볼드로 표시됨. tr 내에서 사용 |
td | 데이터 열(column). tr 내에서 사용 |
form | 입력 양식. 내부의 입력 받은 데이터를 모아 action 속성에 지정된 url로 제출 |
input | 입력 영역을 지정 (text, password, hidden, radio, checkbox 등) |
button | 버튼 (submit, reset, button 등) |
속성(property)은 각 태그가 가지는 고유의 특성입니다.
모든 태그가 공통으로 가지는 속성이 있는 반면 태그의 종류마다 다른 속성을 가질 수도 있습니다.
속성 | 용도 |
id | 요소를 구분하는 식별자 |
class | 요소의 특성 |
title | 요소의 제목 또는 설명 |
style | CSS 문법을 따르는 레이아웃 |
728x90
'Frontend' 카테고리의 다른 글
[JS] Form element (0) | 2024.02.21 |
---|---|
[JS] 자바스크립트로 HTML 객체 만들기 (0) | 2024.02.14 |
DOM Script에 대해서 (0) | 2024.02.14 |
[JS] 알림창 종류 정리 (0) | 2024.02.08 |
[JS] HTML에 JavaScript 코드 삽입하기 (0) | 2024.01.26 |
Comments