[HTML] [3] 태그(2) - <ul>, <ol>, <li>, 주석

2021. 3. 3. 14:02·Language/HTML
반응형

1. <ul> + <li>

<ul>은 "unordered list"의 약자로 순서가 없는 리스트 컨테이너를  만드는 태그이다. 해당 태그의 내부에 "list item"의 약자인 <li> 태그를 사용하여 무순서 리스트를 생성할 수 있다.

 

2. <ol> + <li>

<ol>은 "ordered list"의 약자로 순서가 있는 리스트 컨테이너를 만드는 태그이다. <li>와 마찬가지로 해당 태그의 내부에 <li> 태그를 사용하여 리스트의 항목을 추가할 수 있다.

 

3. <table> + (<tr> + <th> + <td>)

 테이블을 만들어주는 태그이다. 우선 <table>태그를 통해 테이블 컨테이너를 만들어준다. <tr> 태그는 표의 한 행을 감싸는 태그이고, <th> 태그는 표의 제목 셀을 나타내는 태그이다. <td> 태그는 테이블의 데이터를 나타내는 태그이다.

표의 제목 셀을 위한 <th>태그는 필요에 따라 생략할 수도 있다. 

<table> 태그 내부에 "border" 속성을 추가하여 테두리를 쉽게 만들 수 있다.

또한 각 행마다 "colspan", "rowspan" 속성을 추가하여 행 또는 열 방향으로 테이블의 데이터를 병합할 수도 있다.

 

4. 주석

<!-- ~ --> 을 사용하여 주석을 입력할 수 있다.

반응형
저작자표시 (새창열림)

'Language > HTML' 카테고리의 다른 글

[HTML] [6] 태그(5) - <br>, <blockquote>, <audio>, <video>, <span>  (0) 2021.03.03
[HTML] [5] 태그(4) - <header>, <article>, <section>, <div>, <navigation>  (1) 2021.03.03
[HTML] [4] 태그(3) - 입력 양식 만들기  (0) 2021.03.03
[HTML] [2] 태그(1) - <h1>, <a>, <img>, <p>  (0) 2021.03.03
[HTML] [1] html 파일의 골격  (0) 2021.03.03
'Language/HTML' 카테고리의 다른 글
  • [HTML] [5] 태그(4) - <header>, <article>, <section>, <div>, <navigation>
  • [HTML] [4] 태그(3) - 입력 양식 만들기
  • [HTML] [2] 태그(1) - <h1>, <a>, <img>, <p>
  • [HTML] [1] html 파일의 골격
개발하는 사막여우
개발하는 사막여우
개발개발 주저리주저리
    반응형
  • 개발하는 사막여우
    개발하는 사막여우
    개발하는 사막여우
  • 전체
    오늘
    어제
    • All (311)
      • Books (13)
        • 읽기 좋은 코드가 좋은 코드다 (13)
      • Study (6)
        • Blockchain (3)
        • Algorithm (3)
      • Baekjoon (36)
      • Programmers (166)
      • LeetCode (15)
      • Open Source (1)
        • Youtube Popout Player (1)
      • Language (32)
        • Python (9)
        • JS (8)
        • Java (5)
        • HTML (6)
        • CSS (4)
      • Library & Framework (15)
        • React.js (15)
      • IDE (2)
        • IntelliJ (2)
      • Airdrop (9)
      • Tistory (2)
      • etc.. (7)
        • Cozubi (6)
        • lol-chess (0)
  • 블로그 메뉴

    • Github
  • 링크

    • Github
  • 공지사항

  • 인기 글

  • 태그

    코주비
    Python
    카카오 알고리즘 문제
    2018 KAKAO BLIND RECRUITMENT
    코딩테스트연습
    클린 코드
    카카오 공채
    신규 코인 에어드랍
    프로그래머스
    프로그래머스 위클리 챌린지
    클린 코드 작성법
    파이썬
    카카오 코딩테스트
    읽기 좋은 코드가 좋은 코드다
    programmers
    알고리즘문제풀이
    Cozubi
    백준
    코인줍줍
    Java
  • 최근 댓글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.6
개발하는 사막여우
[HTML] [3] 태그(2) - <ul>, <ol>, <li>, 주석
상단으로

티스토리툴바