(7) HTML 태그

Notice

Recent Comments

Link

instagram

« 2024/07 »
일	월	화	수	목	금	토
	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	31

Tags more

Archives

관리 메뉴

Minwoo Dev.

(7) HTML 태그 - f 본문

Web

(7) HTML 태그 - f

itisminu 2023. 7. 9. 13:13

728x90

SMALL

<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>

공부를 목적으로 정리한 게시글입니다.

출처 - http://www.tcpschool.com/html-tags/intro