Recent posts

Recent comments

Archive

Calender

«   2024/04   »
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
📂 HTML

[ HTML ] 태그 목록 🕔 2015. 1. 31. 15:55

예전에 어떤 분이 html을 어떻게 하는 거냐고 네이버에 질문을 올렸길래

답변으로 달았던 내용인데, 여기에다가 옮겨담음.

내용을 보아하니, html4에서 html5로 넘어갈 즈음에 작성한 듯하다.


(작성일 2013년 6월 2일)


html의 문서 작성은 메모장으로 하는 거구요.

자세한 사항은, “ html 작성법 ” 이나 “ body 태그 ” 처럼 검색하시면 찾으실 수 있습니다.


기본적인 작성법은 아래와 같습니다.

 
<!DOCTYPE html> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 

<title> 나의 첫 페이지 </title> 

</head> 

<body> 

이곳에다가, 보여줄 내용을 입력하면 됩니다. *^^*

</body> 
</html> 
 

위에서, meta 태그를 작성하는 방법이, 한 가지가 더 있는데요.

<meta http-equiv="Content-Type" content="text/html; charset=euc-kr">

그 의미는 아래와 같습니다.


1. euc-kr :

한글과 특수문자, ‘한국에서 통용되는 한자’ 그리고 ‘영문’만을 표현할 수 있습니다.


2. utf-8 :

세계적으로 표준화된 문자셋이고 세계의 거의 모든 문자를 표현 가능하도록 설계되어 있습니다.


그리고 기본적인 태그 목록은 아래와 같습니다.


1. 반드시 필요한 태그들이지만, 그 의미까지는 처음부터 알 필요는 없을 것 같습니다.

    기본 작성법만 알면 되는 태그들입니다.

<!DOCTYPE> 
<html> 
<head> 
<meta> 
<title> 
<body> 

2. 가장 많이 쓰이는 태그들입니다.

    비슷하거나 관계있는 것끼리 묶었습니다. 중요도가 아닌, 알파벳 순서입니다.

    “ blockquote 태그 ” 라고 검색하는 식으로 찾으시면 됩니다.

    이 태그들은 <body>와 </body> 사이에 넣어줍니다.

<address> 
<br> 
<blockquote> 
<pre> 
<p> 

<abbr> 
<bdo> 
<cite> 
<code> 
<del> 
<ins> 
<dfn> 
<em> 
<i> 
<kbd> 
<q> 
<samp> 
<strong> 
<u> 
<s> 
<small> 
<sub> 
<sup> 
<var> 

<div> 
<hr> 
<h1> ~ <h6> 
<span> 

<a>
<img> 
<map> 
<area> 
<embed>
<object> 
<param> 

<!-- 주석태그 -->

<table> 
<tr> 
<td> 

<caption> 

<colgroup> 
<col> 

<tbody> 
<tfoot> 
<thead> 
<th> 

<dl> 
<dt> 
<dd> 

<ol> 
<ul> 
<li> 

<button> 

<iframe> 
<form> 
<fieldset> 
<legend> 
<textarea> 
<input> 
<label> 
<select> 
<option> 
<optgroup> 

아래 목록은, 현재까지 쓰이고는 있으나, 점차 사라지는 태그들이라는군요.
꽤 쓸만한 태그들이었는데...

그래도 아래 태그에 대해서 알아두는게 나중에 css 공부할 때 도움이 될겁니다.

<font> 
<b> 
<center> 
<dir> 
<tt> 

<frame> 
<frameset> 
<noframes> 

역시 점차 사라지는 태그들이나, 제 경험상, 여러번 웹문서 만들어봤어두,
아래 태그들은 써본 적이 없네여... 워낙 기본만 다뤄서 그랬는지도... ^^*

<acronym> 
<basefont> 
<big> 
<strike> 

<applet> 
<menu> 

[ 오늘 추가한 내용 ] <menu> 태그는 없어진 게 아니라
특이하게도, 사용법과 쓰임새가 완전히 바뀌었음!!!


아래는 최근에 새로 생긴 태그들이라, 아직 적용안되는 웹브라우저가 있을 수 있습니다.
저도 아직 써보지를 않아서, 그냥 알파벳 순으로 적었습니다.

<article> 
<aside> 
<audio> 
<bdi> 
<canvas> 
<command> 
<datalist> 
<details> 
<dialog> 
<figcaption> 
<figure> 
<footer> 
<header> 
<hgroup> 
<keygen> 
<mark> 
<meter> 
<nav> 
<output> 
<progress> 
<rp> 
<rt> 
<ruby> 
<section> 
<source> 
<summary> 
<time> 
<track> 
<video> 
<wbr> 

여기까지는, body 태그 안에 넣어주는 태그들이었구요.


아래 태그들은 <head>와 </head> 사이에 넣어줍니다.

(깊이 파고들다보니, script 태그를 body 안에 넣을 때도 있더군요. ^^*)

<base> 
<style type="text/css"> 
<script type="text/javascript"> 
<noscript> 
<link> 
<meta> 

처음에 html과 관련된 태그를 공부하시구요,

그 다음엔, <style> 태그와 관련된 css를 공부하시구요,

마지막엔, <script> 태그와 관련된 자바스크립트를 공부하시면 됩니다.