html 태그
<head>: 사이트의 부가 정보를 담고 있는 태그, invisible
-<title>: 웹페이지 제목
-<meta/>: 웹페이지의 정보를 담고있음, self-closing 태그<meta name="description" content="~"/>: 브라우저에서 보이는 웹 기본 정보, google이 검색할 때 찾는 태그(+title)<meta charset="utf-8"/>: 텍스트 렌더링❗️<meta property="og:(title/image/...)"/>: 외부로 공유했을 때 썸네일로 쓰이는 제목, 썸네일 등
<link rel="shortcut-icon" sizes="~" href="~">: 웹사이트 타이틀 로고<body>: 사이트의 내용을 담고 있는 태그, visible<form><input type="~"/></form>: 다양한 type 존재
ex)
<input type="password"/>
<input type="submit" value="제출버튼이름"/>
<input placeholder="칸이름" type="text"/>
<input type="file" accept="받을 파일 유형/>
* required로 제출 전 필수적으로 검증할수도, disabled로 비활성화할 수도 있음
<label>: input과 함께 작동하며 같은 속성을 갖고 있는 input의 기능을 대신할 수 있음
❗️label의 for과 input의 id를 같게해야 함<header>, <main>, <footer>: semantic tag(div와 같은 역할이지만 의미가 있는 태그)
❗️최대한 semantic tag를 활용하여 작성할 수 있도록 하기!<span>: 짧은 텍스트<p>: 긴 텍스트, 문단
기타 참고
1. html, css, js 등 구글링할 때 'mdn' 붙여서 검색하기
(html 태그는 모두 암기할 필요 없음, 어떤 구조인지만 알아두고 태그 및 속성은 구글링해서 확인하기!)
2. 모든 태그에 적용되는 attribute(속성)도 있고, 특정 태그에만 있는 attribute(속성)도 있음! 꼭 확인하고 활용하기
3.<html>에도 attribute 달 수 있음
ex)<html lang="kr">:주언어=한국어
출처: 노마드코더, https://nomadcoders.co
코린이의 개발공부록🐥