(7) HTML 태그 - f
<fieldset> : <form> 요소에서 연관된 요소들을 하나의 그룹으로 묶을 때 사용함.
<fieldset> 요소는 하나의 그룹으로 묶은 요소들 주변으로 박스 모양의 선을 그려줍니다.
또한, <legend> 요소를 사용하면 <fieldset> 요소의 캡션(caption)을 정의할 수 있습니다.
<form action="/examples/media/action_target.php" method="get">
<fieldset>
<legend>학사 관리 로그인</legend>
이름 : <input type="text" name="st_name"><br>
학번 : <input type="text" name="st_id"><br>
학과 : <input type="text" name="department"><br>
<button type="submit">제출하기</button>
</fieldset>
</form>
<figcaption> : 이미지나 다이어그램, 사진과 같이 문서의 주요 흐름과는 독립적인 콘텐츠를 정의하는 <figure> 요소의 캡션(caption)을 정의할 때 사용함.
<figcaption> 요소는 <figure> 요소의 첫 번째 자식 요소이거나 마지막 자식 요소로만 위치할 수 있습니다.
<figure>
<img src="/examples/images/img_flower.png" alt="flowers" width="350" height="263">
<figcaption>Fig 1. 꽃사진</figcaption>
</figure>
<figure> : 삽화나 다이어그램, 사진 등과 같이 문서의 주요 흐름과는 독립적인 콘텐츠를 정의할 때 사용함.
<figure> 요소의 콘텐츠는 문서의 내용과는 연관성을 가지지만, 해당 콘텐츠의 위치가 문서의 주요 흐름과는 독립적이어서 제거해도 문서의 흐름에 영향을 주어서는 안 됩니다.
<figure>
<img src="/examples/images/img_flower.png" alt="flowers" width="350" height="263">
</figure>
<font> : 텍스트의 폰트(font), 색상 그리고 크기를 정의할 때 사용함.
HTML5에서는 <font> 태그를 더 이상 지원하지 않으며, 대신 CSS를 사용해야 합니다.
<p>이 텍스트는 기본 텍스트입니다.</p>
<p><font color="red">이 텍스트의 색상은 빨간색입니다.</font></p>
<p><font face="serif">이 텍스트의 글꼴은 serif입니다.</font></p>
<p><font size="5">이 텍스트의 크기는 5입니다.</font></p>
<footer> : 문서나 특정 섹션(section)의 푸터(footer)를 정의할 때 사용함.
푸터(footer)는 보통 <footer> 요소가 포함되어 있는 문서나 섹션에 대한 아래와 같은 정보를 포함합니다.
- 저자(author) 정보
- 저작권 정보
- 연락처
- 사이트맵(sitemap)
- 페이지 맨 위로 되돌아갈 수 있는 Top 버튼
- 연관 페이지 등
하나의 HTML 문서에는 여러 개의 <footer> 요소가 포함될 수 있습니다.
<footer>
<p>Copyright © 2018 tcpschool.co.,Ltd. All rights reserved.</p>
<address>Contact webmaster for more information. 070-1234-5678</address>
</footer>
<form> : 사용자로부터 입력을 받을 수 있는 HTML 입력 폼(form)을 정의할 때 사용함.
<form> 요소는 다음과 같은 요소들을 하나 이상 포함할 수 있습니다.
- <button>
- <fieldset>
- <input>
- <label>
- <option>
- <optgroup>
- <select>
- <textarea>
<form action="/examples/media/action_target.php">
이름 : <input type="text" name="st_name"><br>
학번 : <input type="text" name="st_id"><br>
학과 : <input type="text" name="department"><br>
<input type="submit">
</form>
<frame> : <frameset> 요소에 포함되는 하나의 프레임(frame)을 정의할 때 사용함.
<frameset> 요소에 포함된 각각의 <frame> 요소는 테두리(border)나 스크롤, 크기 재조정 가능 여부 등 서로 다른 속성값을 가질 수 있습니다.
HTML5에서는 <frame> 태그를 더 이상 지원하지 않습니다.
더 이상 지원되지 않는 <frame> 요소를 사용하면서 HTML 유효성 검사를 통과하기 위해서는 다음의 두 가지 방법처럼 DOCTYPE을 선언해야 합니다.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<frameset cols="25%,*,25%">
<frame name="left" src="/html/intro"/>
<frame name="center" src="/css/intro"/>
<frame name="right" src="/php/intro"/>
</frameset>
<frameset> : 문서의 레이아웃을 구성하기 위해 사용되는 프레임(frame)들의 집합을 정의할 때 사용함.
<frameset> 요소는 하나 이상의 <frame> 요소를 포함하며, 각각의 <frame> 요소는 서로 다른 문서를 포함할 수 있습니다. <frameset> 요소는 열(column)이나 행(row)의 개수뿐만 아니라 각 열과 행이 어느 정도의 면적을 차지하고 있는지 퍼센트(%)나 픽셀(pixel) 단위로 명시합니다.
HTML5에서는 <frameset> 태그를 더 이상 지원하지 않습니다.
더 이상 지원되지 않는 <frame> 요소를 사용하면서 HTML 유효성 검사를 통과하기 위해서는 다음의 두 가지 방법처럼 DOCTYPE을 선언해야 합니다.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<frameset cols="33%,*,33%">
<frame name="left" src="/html/intro"/>
<frame name="center" src="/css/intro"/>
<frame name="right" src="/php/intro"/>
</frameset>
공부를 목적으로 정리한 게시글입니다.