HTML - 리스트 태그 중 - ul태그, ol태그, li태그
텍스트 표시 (4)
오늘은 HTML - 헤딩 태그 , 텍스트 서식 , hr 태그 및 주석 처리에
대해서 알아 보도록 하겠습니다.
태그 기초부터 알아보기 전에
압타나 스튜디오를 직접 설치 하시고 한번씩 따라해 보시기 바랍니다.
(백번 보는 것 보다 한번 살짝 타이핑 해보면 이해 되니! 꼭!)
(굳이 압타나 아니더라도 이클립스등 자신에게 맞는 HTML 툴이 있으시다면 사용하시기 바랍니다.)
먼저 HTML에서 리스트 태그란?
리스트 태그는 말 그대로 항목을 나열하는데 사용하는 태그이며
이 태그 안에는 텍스트 말고도 이미지, 비디오, 링크를 넣을 수도 있으며
태그에 따라 번호가 있는 리스트가 있고
태그에 따라 번호가 없는 리스트도 있고
태그에 따라 정의 리스트라는 것도 있습니다.
이 내용은 하나씩 설명 하면서
아래로 글을 적어 보도록 하겠습니다.
1. 번호 있는 리스트 <ol> <li> 태그
위 사진은 번호 있는 리스트를 사용한 모습 입니다.
번호 있는 리스트를 사용시 ol태그로 시작하며 각 리스트 항목은 li 태그로 시작 합니다.
이 다음은 번호 없는 리스트를 사용해 보겠습니다.
2. 번호 없는 리스트 <ul> <li> 태그
위 사진은 번호 없는 리스트를 사용한 모습 입니다.
번호 없는 리스트 사용시 ul태그로 시작하며 각 리스트 항목은
위와 동일한 li 태그로 시작 합니다.
3. 정의 리스트 <dl> <dt> <dd> 태그
위 사진은 정의 리스트를 사용한 모습 입니다.
정의 리스트란 위 사진을 보시면 아시겠지만 항목들과 함께 항목의 정의가
표시되는 리스트 태그이며 사용법은 위와 동일하게 <dl> 태그 생성 후
<dt> 태그로 항목을 나타내고
<dd> 태그로 항목에 대한 설명을 추가 합니다.
여기까지 HTML - 리스트 태그 사용법에 관련되어 기록해 보았습니다.
다시 한번 말하지만 백번 보는 것 보다 한두번 써보는게 더 이해하기 쉽습니다.
이상 HTML - 리스트 태그 중 - ul태그, ol태그, li태그 - 텍스트 표시 (4)에
관련된 포스팅을 마치도록 하겠습니다.
'웹 공부 > 2. HTML5' 카테고리의 다른 글
HTML - 이미지(img) 태그 와 src, width, height, alt 속성 - 텍스트 표시 (6) (0) | 2017.05.14 |
---|---|
HTML - 링크, a태그 와 href, target, id 속성 - 텍스트 표시 (5) (0) | 2017.05.13 |
HTML - 특수 문자 사용법 텍스트 표시 (3) (0) | 2017.05.11 |
HTML - 헤딩과 텍스트 서식, 수평선 태그, 주석 - 텍스트 표시 (2) (0) | 2017.05.10 |
HTML - 텍스트 태그, p태그, br태그, pre태그 - 텍스트 표시 (1) (0) | 2017.05.09 |
댓글