본문 바로가기
Development study summary/HTML

HTML_링크, 이미지, 테이블, 리스트 태그 사용법

by Eilison 2023. 7. 10.

링크, 이미지, 테이블, 리스트 태그에 대하여 정리해 보려고 합니다.

링크 Tag

a 태그는 클릭 시 다른 페이지로 이동시켜주는 태그입니다.

속성은 href와 target이 있는데 herf는 주소를 나타내고, target은 새창을 어디에 띄울건지를 나타냅니다.

<a href="https://www.Eilison.com">링크</a>

 

이미지 Tag

이미지는 이미지를 불러오는 태그입니다. 이미지는 안의 내용이 없기 떄문에 닫는 태그가 없습니다.

속성은 이미지의 경로를 불러오는 scr와 이미지의 경로가 잘못됬거나 파일이 꺠질 시 나오는 메세지를 입력하는 alt가 있습니다.

<img src="htp://www.Eilison.com" alt="이미지 꺠짐" />

 

테이블 Tag

테이블은 표를 표시하는 태그입니다.

테이블은 셀 하나 하나가 다 태그이기 떄문에 간단한 테이블도 양이 좀 많습니다.

  • caption: 테이블의 제목입력
  • thead: 첫 줄
  • tfoot: 마지막 줄
  • tbody: 그 이외의 줄
<table>
  <caption>일정</caption>
  <thead></thead>
  <tbody></tbody>
  <tfoot></tfoot>
</table>

 

리스트 Tag

리스트는 목록을 표시하는 태그입니다.

종류는 두가지가 있는데 ul과 ol입니다. ul은 순서가 없는 리스트고, ol은 순서가 있는 리스트입니다.

두 리스트의 항목은 li 태그로 표시합니다.

<ul>
  <li>Eilison</li>
  <li>Tistory</li>
  <li>com</li>
</ul>
<ol>
  <li>Eilison</li>
  <li>tisoty</li>
  <li>com</li>
</ol>

'Development study summary > HTML' 카테고리의 다른 글

HTML_멀티미디어 태그  (0) 2023.07.14
HTML_공간, 시맨틱 태그  (0) 2023.07.12
HTML_기본 구조와 태그  (0) 2023.07.09