코드랩 레퍼런스

<dfn> 본문

HTML

<dfn>

webstoryboy 2016.05.28 15:34
<dfn> 태그는 전문적인 용어를 정의할 때 사용합니다.
특징 설명
콘텐츠 카테고리 Flow Content, Phrasing Content, Palpable Content.
콘텐츠 속성 Global Attributes, Event Attributes
콘텐츠 요소 Inline Element
닫는 태그 Closing (<dfn> ~ </dfn>)
버전 HTML4
시각적 표현 -

Definition

  • <dfn> 태그는 학문적인 개념이나 새로운 용어 및 전문어를 정의(Definition)할 때 사용합니다.
  • <dfn> 태그는 여러개의 전문적인 용어가 동일하게 사용되었을때에는 처음만 정의합니다.
  • <dfn> 태그의 부모요소는 정의된 요소의 설명이 포함되어 있어야 합니다.
  • <dfn> 태그는 title 속성을 넣어서 약어를 설명 할 수 있습니다.
  • <dfn> 태그는 <abbr> 태그를 같이 사용하여 약어를 설명 할 수 있습니다.
  • <dfn> 태그에 아이디를 설정하여, <a> 링크로 참조할 수 있습니다.

Compatibility

크롬 아이콘 파이어폭스 아이콘 사파리 아이콘 오페라 아이콘 안드로이드 아이콘 ios 아이콘 익스플로러6 아이콘 6 익스플로러7 아이콘 7 익스플로러8 아이콘 8 익스플로러9 아이콘 9 익스플로러10 아이콘 10 익스플로러11 아이콘 11 엣지 아이콘
<dfn>

Sample

dfn 태그

  1. HTML은 웹 페이지를 만들기 위한 언어입니다.
  2. HTML의 HT(Hyper Text)는 문서와 문서의 연결을 의미합니다.
  3. HTML의 M(Markup)는 마크업(태그)을 의미합니다.
  4. HTML의 L(Language)는 언어를 의미합니다.
  5. HTML은 문서와 문서로 연결된 태그 언어를 말합니다.

  • 첫번째 줄은 dfn 태그만 사용하여 적용할 수 있습니다.
  • 두번째 줄은 title 속성을 넣어서 적용할 수 있습니다.
  • 세번째 줄은 abbr 태그와 같이 사용할 수 있습니다.
  • 네번째 줄은 dfn 태그에 아이디를 설정합니다.
  • 다번째 줄은 용어의 사용이 반복된다면, 링크(설정한 아이디)로 연결하여 설명을 참조 할 수 있습니다.
  • <!DOCTYPE html>
    <html lang="ko">
    <head>
        <meta charset="UTF-8">
        <title>Dfn</title>
    </head>
    <body>
    <h1>dfn 태그</h1>
    <div>
    	<ll>
    		<li><dfn>HTML</dfn>은 웹 페이지를 만들기 위한 언어입니다.</li>
    		<li><dfn title="HyperText Markup Language">HTML</dfn>의 HT(Hyper Text)는 문서와 문서를 연결한다를 의미합니다.</li>
    		<li><dfn><abbr title="HyperText Markup Language">HTML</abbr></dfn>의 M(Markup)는 마크업(태그)을 의미합니다.</li>
    		<li><dfn id="dfn">HTML</dfn>의 L(Language)는 언어를 의미합니다.</li>
    		<li><a href="#dfn">HTML</a>은 문서와 문서로 연결된 태그 언어를 말합니다.</li>
    	</ll>
    </div>
    <hr>
    <div>
    	<ul>
    		<li>첫번째 줄은 dfn 태그만 사용하여 적용할 수 있습니다.</li>
    		<li>두번째 줄은 title 속성을 넣어서 적용할 수 있습니다.</li>
    		<li>세번째 줄은 abbr 태그와 같이 사용할 수 있습니다.</li>
    		<li>네번째 줄은 dfn 태그에 아이디를 설정합니다.</li>
    		<li>다섯번째 줄은 용어의 사용이 반복된다면, 링크(설정한 아이디)로 연결하여 설명을 참조 할 수 있습니다.</li>
    	</ul>
    </div>
    </body>
    </html>
    
    Tag
    공유하기 링크

    Ad

    Comments
    댓글쓰기 폼