HTML 태그 정리

2017.01.13 15:22|

나리보스|

추천19|

조회수1,274|

댓글10

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> 

 

오늘은 기분 좋은 불금!

----------

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

하트 아이콘하늘섬님 외 18명이 추천했습니다.

댓글 10
아이보스 알림

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

SNS에 공유하여 정보를 나누어 보세요. 페이스북 트위터 카카오스토리
하루동안 보지 않기
소셜로그인
번호제목작성자등록일추천조회
138개인방송국 솔루션 제작 [2] 

택배왕김착불

18:33015
136오픈마켓 크롤링 하시는 업체 있나요?[1] 

쇼핑왕

17.05.19076
135자사몰 운영하시는 분들의 비율이 어느정도될까요?[4] 

두둠칫두둠칫

17.05.120187
134안녕하세요, 쇼핑몰 솔루션을 환불해 보신 분이 계실까..[3] 

코스모스플랜

17.04.260180
133안녕하세요. 사이트 운영에 도움이 필요해 의견 여쭤봐..[2] 

스텝어라운드

17.04.180192
BEST(html코딩)마케터를 위한 바로가기 버튼 생성법 [5] 

권용범

17.04.11181,152
130기존 쇼핑몰 리뉴얼 관련 질문입니다.[3] 

ajlfdsjl

17.04.030233
129쇼핑몰 홈페이지 자체개발 vs 메이크샵 어떤게?[2] 

무슨상관

17.03.291320
127동영상강좌 1강[3] 

바나로이

17.02.282388
126쇼핑몰제작 추천좀해주세요.[4] 

바나로이

17.02.272319
125[IOS]하이브리드앱 , 웹뷰에 관하여. 

바나로이

17.02.272459
1241.쇼핑몰 솔루션의 선택 !![9] 

바나로이

17.02.259601
123쇼핑몰 제작 강좌를 진행해보려 합니다[11] 

바나로이

17.02.257284
119다수엑셀파일을 하나로 합치기(무료프로그램)[6] 

전옥철

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

라임엘프

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

보스톡4

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

나리보스

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

나리보스

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

CHLOE_SK

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

디스트

17.01.142546
BESTHTML 태그 정리[10] 

나리보스

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

나리보스

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

맘스퀸

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

uniquest

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

맘스퀸

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

sinun

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

groovy38

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

보스톡

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

보스톡

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

보스톡

16.09.220387
1234 다음 페이지로 이동 마지막 페이지로 이동
top

로그인 후 더욱 많은 기능을 이용하세요!

네이버 계정으로 로그인
페이스북 계정으로 로그인
구글 계정으로 로그인
카카오톡 계정으로 로그인
이메일 또는 아이디로 로그인
X
회원가입ID/PW 찾기 소셜 계정 로그인

전체 알림

모두 읽음 표시 알림함

내 댓글

전체보기

스크랩함

전체보기

스크랩한 게시글이 없습니다.

아이보스 추천 게시글을 스크랩 해보세요! 스크랩하기
아이보스 배너광고 영역