HTML 태그 정리

2017.01.13 15:22|

나리보스|

추천18|

조회수1,019|

댓글9

HTML이란? 

 

HTML은 하이퍼텍스트 마크업 언어

(HyperText Markup Language, 문화어: 초본문표식달기언어, 하이퍼본문표식달기언어)라는 의미의 웹 페이지를 위한 지배적인 마크업 언어다. 

[출처 : 위키백과] 

 

HTML 태그

 

자주 사용하는 태그들의 간단한 정리입니다.

참고용으로 봐주세요 :)

 

<html></html>

 

<head></head>

 

<meta> : 정보

 

<title> : 제목

 

<body> : 본문

 

<div></div> : division 문서영역 등의 분할

 

<p></p> : paragraph 단락, 문단

 

<span></span> : 인라인요소들의 그룹화에 사용

 

<h1></h1>~<h6></h6> : 제목, 본문의 헤드 요소

 

<hr> : 단락 구분, 문서의 구분선

 

<!-- 주석 --> : 주석

 

<br> : break 줄바꿈

 

<table></table> : 표

 

<thead></thead> : 표의 헤더 행 그룹

 

<tbody></tbody> : 표의 내용 행 그룹

 

<tfoot></tfoot> : 표의 푸터 행 그룹

 

<th></th> : 셀 제목

 

<tr></tr> : 행

 

<td></td> : 셀

 

<ol></ol> : ordered list 순서가 붙는 리스트 형태

 

<ul></ul> : unordered list 순서가 붙지 않는 리스트 형태 (기호가 붙는다)

 

<li></li> : 리스트

 

<dl></dl> : definition list 정의 리스트

 

<dt></dt> : definition term 항목

 

<dd></dd> : definition description 설명

 

<a href="#" target=""></a> : anchor 링크

 

<img src="" alt=""> : 이미지

 

<form name="" action="" method=""></form> : 폼

 

<input type=""> : 입력상자

 

<textarea></textarea> : 텍스트 박스

 

<select>

<option value="1">one</option>  : 선택메뉴 

</select>

 

<button></button> : 버튼

 

HTML 문서의 기본 형태


​<html> 

<head>

<title></title>

</head>

<body>

</body>

</html>

 

태그를 이용한 예제


​자주 묻는 질문 1. 링크 변경 

 

요청사항

 

<a href="http://www.i-boss.co.kr/">아이보스</a> 

 

링크변경 : http://web.i-boss.co.kr/ 

텍스트변경 : 아이보스 > 아이보스 웹에이전시

 

수정완료

 

<a href="http://web.i-boss.co.kr/">아이보스 웹에이전시</a> 

 

자주 묻는 질문 2. 색상 변경

 

요청사항

 

<div>오늘은 기분 좋은 불금!</div>

 

색상변경 : '불금' 텍스트를 빨간색으로 변경

 

수정완료

 

<div>오늘은 기분 좋은 <span style="color:#ff0000;">불금!</span></div> 

 

오늘은 기분 좋은 불금!

----------

참 쉽쥬 :)
보스님들 하루 마무리 잘하시고 모두 불금 보내세요!

하트 아이콘럭키린다님 외 17명이 추천했습니다.

댓글 9
아이보스 알림

지금 이 글은 나리보스 보스님의 아이보스 인기 게시글입니다.

SNS에 공유하여 정보를 나누어 보세요. 페이스북 트위터 카카오스토리
하루동안 보지 않기
소셜로그인
번호제목작성자등록일추천조회
123쇼핑몰 제작 강좌를 진행해보려 합니다  

바나로이

11:21231
119다수엑셀파일을 하나로 합치기(무료프로그램)[3] 

전옥철

17.02.164102
118기존 임대몰에서 몰인몰로의 이전 문의드립니다.[5] 

라임엘프

17.02.132135
117모바일에 HTML5 적용하면 문제가 될까요?[2] 

보스톡4

17.02.053112
116파비콘(Favicon) : 웹페이지 상단 탭 아이콘 

나리보스

17.02.013139
BEST카페24 SNS 로그인 연동! 가능합니다![8] 

나리보스

17.01.1611788
114자사몰 SNS 연동 로그인 기능 문의드립니다.[3] 

CHLOE_SK

17.01.161139
113카페24로 쇼핑몰제작시 페이스북 픽셀[5] 

디스트

17.01.142261
BESTHTML 태그 정리[9] 

나리보스

17.01.13181,020
110크롬 개발자 도구를 사용하여 홈페이지 수정요청하기[4] 

나리보스

17.01.060422
107홈페이지 리뉴얼을 제로보드 xe로 하려고 합니다.[7] 

맘스퀸

16.12.052278
106웹페이지에 2개의 이미지를 좌우로 나란히 붙이기...도와..[8] 

uniquest

16.11.242283
105홈페이지 리뉴얼 작업하려고 합니다.[6] 

맘스퀸

16.11.071658
104미샤닷컴 어디서 만들었는지 알 수 있을까요? 

sinun

16.11.011375
102굿엠디 써보신 분들 계시나요? 

groovy38

16.10.191299
99메이크샵과 카페24의 차이에 대한 간단한 대화 

보스톡

16.09.233613
98고도몰5를 쓰려고 하는데 DB 연동이 가능할까요? 

보스톡

16.09.230523
97방문자 카운팅 프로그램 삽입으로 홈페이지 먹통이 될 .. 

보스톡

16.09.220295
96카페24 아이콘과 할인가 일괄 적용하는 방법 

보스톡

16.09.220319
95웹사이트 템플릿 참조 사이트 추천해주세요. 

보스톡

16.09.220262
123456 다음 페이지로 이동 마지막 페이지로 이동
top
아이보스 배너광고 영역