【 HTML 배우기 】 - 3탄

---

【 HTML 배우기 】 - 3탄

 

---

🦎 Section 01. 목록 태그

      ① <ol> : ordered list 약자로, 순서 있는 목록을 나타낼 때 사용하는 태그입니다
      ② <ul> : un ordered list 약자로, 순서 없는 목록을 나타낼 때 사용하는 태그입니다
           → 각 태그들은 list item의 약자인 <li>를 중첩해서 사용합니다 😎

---

 

 

---

🦎 Section 02. 표 태그

      - <table>, <tr>, <th>, <td>를 이용해서 표를 만들 수 있습니다

       ① <table> : 표를 만드는 태그입니다
       ② <tr> : 각 행을 만드는 태그입니다
       ③ <th> : 각 행에 있는 data 셀을 만드는 태그입니다
       ④ <td> : 각 행에 있는 data 셀을 만드는 태그입니다

 

 

 

💡여기서 잠깐!
     우리 몇 가지만 알고  가요! 😉

---

  【 <th> vs <td> 】 

    - <th>와 <td>는 모두 각 행에 있는 data 셀을 만드는 태그입니다
    - 둘의 차이는
      <th>는 표제에서 사용할 data일 경우에 사용하는 태그이고,
      <td>는 일반 data일 경우에 사용하는 태그라는 점입니다

 

      그렇기 때문에
      <th>를 사용했을 경우엔 <td>와는 달리,
      표 내에서 data들이 자동적으로 bold체로 셀의 중앙에 정렬되게 됩니다 😊
      ( 확인하러 가기 : https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table )

       

 

【 colspan & rowspan 】

    - 여러 column(열)에 걸친 셀을 만들고 싶은 경우엔
      <th> or <td>에 colspan(column span) 속성을 부여하면 됩니다 !

 

      반대로,

      여러 row(행)에 걸친 셀을 만들고 싶은 경우엔,
      <th> or <td>에 rowspan(row span) 속성을 부여하면 됩니다 !
      ( 확인하러 가기 : https://2018-start.tistory.com/21 

---

 

 

---

🦎 Section 03. 그림 태그

      - <img>는 그림을 삽입할 때 사용하는 태그입니다
        이 태그는 Empty Tag로 끝 태그가 없습니다

      - <img>에는 alternate(대처하다)의 약자인 alt라는 속성이 있는데요,
        이 속성을 통해 그림을 못 가져온 경우 text를 통해 대처가 가능합니다 (참 신기하죠? 🤭)

---

 

 

---

🦎 Section ##. Finish

      ① 강의 링크

          ; https://www.udemy.com/course/ssonsalstudy-html/

      ② 대표 이미지 출처

          : https://www.miricanvas.com/

디자인 플랫폼 미리캔버스

---