HTML 기타 태그

강정우·2023년 1월 30일
0

HTML, CSS

목록 보기
21/27
post-thumbnail

<figure>

  • <figure\> 태그는 삽화나 다이어그램, 사진 등과 같이 문서의 주요 흐름과는 독립적인 콘텐츠를 정의할 때 사용한다.
  • <figure\> 요소의 콘텐츠는 문서의 내용과는 연관성을 가지지만, 해당 콘텐츠의 위치가 문서의 주요 흐름과는 독립적이어서 제거해도 문서의 흐름에 영향을 주어서는 안 된다.
<figure>
    <img src="이미지 주소"
         alt="html 입니다.">
    <figcaption>html 사진입니다.</figcaption>
</figure>
html 사진입니다.
  • (처음이나 마지막 자식으로) <figure\>을 넣어서 설명을 덧붙일 수 있다. 제일 처음 <figure\>을 설명으로 사용한다.

<blockquote>

  • HTML <blockquote\> 요소는 안쪽의 텍스트가 긴 인용문임을 나타낸다. 주로 들여쓰기를 한 것으로 그려진다.

  • 인용문의 출처 URL은 cite 특성으로, 출처 텍스트는 <cite\> 요소로 제공할 수 있다.

<figure>
    <blockquote cite="https://www.huxley.net/bnw/four.html">
        <p>문장</p>
    </blockquote>
    <figcaption>—Aldous Huxley, <cite>Brave New World</cite></figcaption>
</figure>

Words can be like X-rays, if you use them properly—they’ll go through anything. You read and you’re pierced.

—Aldous Huxley, Brave New World

<Cite>

  • <blockquote\>의 cite prop과는 다르게 그냥 italitc체이다.
    하지만 시멘틱하게 보면 이는 책, 영화, 그림같은 작품의 제목을 지정할때 사용된다.

<fieldset>

  • 페이지 내 <form> 요소의 id를 받을 수 있는 form 특성으로, <form> 바깥의 <fieldset> 요소를 해당 양식에 포함해야 할 때 사용한다.
  • disabled, <fieldset>의 모든 콘텐츠를 한 번에 비활성화할 수 있다.
<form>
  <fieldset>
    <legend>Choose your favorite monster</legend>

    <input type="radio" id="kraken" name="monster" value="K">
    <label for="kraken">Kraken</label><br>

    <input type="radio" id="sasquatch" name="monster" value="S">
    <label for="sasquatch">Sasquatch</label><br>

    <input type="radio" id="mothman" name="monster" value="M" />
    <label for="mothman">Mothman</label>
  </fieldset>
</form>
Choose your favorite monster
<input type="radio" id="kraken" name="monster" value="K">
<label for="kraken">Kraken</label><br>

<input type="radio" id="sasquatch" name="monster" value="S">
<label for="sasquatch">Sasquatch</label><br>

<input type="radio" id="mothman" name="monster" value="M" />
<label for="mothman">Mothman</label>
profile
智(지)! 德(덕)! 體(체)!

0개의 댓글