dl태그를 처음으로 이용할 기회가 있었으므로, 조사해 보았다! 비망록

1791 단어 HTML5
안녕하세요, 어제, 처음으로 dl 태그를 이용한 기념해야 할 하루가되었습니다. 웃음
그래서 dl 태그란 무엇인지 알아보았습니다!
...라는 비망록입니다.
세트로, dt 태그, dd 태그에 대해서도 기술해 갑니다.

dl 태그



dl -> description list (설명 목록)
단어나 용어의 정의를 하는 경우나, 설명을 하는 경우에 이용합니다.
리스트 표시의 li 태그와 같이, 정의나 설명을 문장이 아니고, 리스트업 하기 때문에, description list라고 생각할 수 있습니다.
다음 섹션에서 설명하는 dt 태그와 dd 태그와 세트에 사용됩니다.

dt 태그



dt -> description term (설명되는 단어)
정의나 설명하고 싶은 말이나 용어를 기술할 때에 이용합니다.

dd 태그



dd -> description, definition(설명 및 정의)
설명의 본문을 기술할 때에 이용합니다.

사용법



대략, 의미를 설명했으므로, 사용법을 봅시다.

sample.html
<!--省略-->
<dl>
    <dt>フレームワーク:</dt>
    <dd>Vue.js</dd>
</dl>
<dl>
    <dt>ライブラリ:</dt>
    <dd>React.js</dd>
</dl>
<!--省略-->

다음 이미지는 위 코드의 실행 결과입니다. ↓



이러한 느낌으로, dt 태그로 둘러싸인, 프레임워크나 라이브러리라고 하는 말에 대해서, dd 태그로 둘러싸인, Vue.js나 React.js라고 하는 설명과 같은 기술이 가능하게 됩니다.
하나의 dt 태그에 대해, 복수의 dd 태그, 즉, 복수의 설명문을 기술하는 것이 가능합니다.

정말 간단하지만 정리해 보았습니다!
미비 등이 있으면 코멘트를 부탁드립니다.

참고 자료



★ HTML5 태그 참조

좋은 웹페이지 즐겨찾기