Front-End/HTML & CSS

[HTML] 헷갈릴 수 있는 태크들!

Voyage_dev 2022. 2. 21. 23:35
i vs em
  • 둘 다 이텔릭체로 폰트 타입을 변환
  • i : 시각적으로만 나타내고 싶을 때
  • em : 문장에서 정말 강조하고 싶은 부분이 있을 때i vs em

 

b vs strong
  • 둘 다 bold체로 보이지만 strong은 정말로 강조하고 싶을 때

 

ol vs ul vs li
  • ol
    • ordered list로 목록 순서가 중요하면 사용하는 태그 ol 속 li 태그 안에 또다른 ol 태그 사용가능

  • ul
    • unordered list로 순서가 필요 없을 때
    • ul 안 li 태그 안에 또다른 ul 태그 가능, nestled loop처럼

  • dl
    • description list로 단어에 대해 설명을 묶고 싶을 때
    • dt는 목록을 나타내는 단어
    • dd는 그 단어에 설명

 

img vs background-image

 

  • img : html에서 사용하는 태그로 이미지가 웹 페이지 안에서 하나의 중요한 요소로 자리잡아야 할 때

 

  • background-image : css에서 사용되는 스타일링, 문서 내용과 별개로 스타일링 목적이면 background-image를 사용
  • 해당 이미지가 없어도, 내용적으로 문서를 읽는데 전혀 지장이 없으면 css 파일 안에 이미지를 집어 넣는게 맞다

 

button vs a
  • 특정한 액션은 button 어디론가 이동한는 링크가 목적이면 a태그

 

출처 :