on
노마드코더 코코아톡 #2
노마드코더 코코아톡 #2
▶ 보이지않는 태그들로 사이트 설정을 해준다.
▶ 브라우저에게 사이트가 어떻게 보이는지
Meta 태그
부가적인 정보를 뜻하는 태그
아주 다양하게 존재한다 .
: 브라우저에게 text를 어떻게 그려달라는지 말해줌.
----------------------------------------------------------------------------
Html 의 lang 속성
: 검색엔진들에 도움을 주기위해
우리 사이트에서 사용되는 언어가 무엇인지 알려준다.
Link 태그
: 탭에 아이콘 이미지를 넣을수 있다.
!!! 구글에 검색할때 "mdn" 이라고 붙이면 모질라 화면으로 제공
→ html 태그는 엄청 많아서 다 외울 필요는 없다
모든 태그를 다 외울 필요없다 .
태그를 작성하는 방법 , 속성을 어떻게 찾는지 알고 그 속성을 어떻게 사용하는지 알면 괜찮다 ,
Form
Label : for
Input : id
▶ 값이 같을 때 for 과 같은 값을 가진 id를 들고있는 input 작동시켜준다
☆ 중요!!
ID
: 바디안에 어떤 캐그에든 넣을수 있는 attribute 이다.
: 고유 식별자이기 때문에 요소당 하나의 아이디만 가질수 있다
: 전체 html 문서에서 id값은 고유해야한다.
: 스크립팅이나 css를 식별할려는 목적을 가짐
시멘틱 html (Semantic) : 의미가 있는 태그
: document 와 content 를 명확하게 묘사할수 있도록
Header, main, footer 등등
보는 사람과 웹사이트로 바로 태그의 의미를 파악하기가 더 쉽다
사방팔방 div 로 하기보단 명확하게 시멘틱 태그를 쓰는것도 좋은 방법이다
Div 는 단순 아무의미도 없는 박스 태그
※ 총정리!!!!
: html은 뼈대 - 브라우저가 이해할수 있는 언어
Css 는 근육
자바스크립트 : 뇌
코드만 보고 어떤 의미인지 파악하기 위해 시멘틱 태그를쓴다.
Attribute 값에는 항상 큰 따옴표를 사용한다
어떤 속성은 모든 태그가 사용 가능하고
일부 속성은 일부 태그에만 사용 가능하다
from http://mini1122.tistory.com/23 by ccl(A) rewrite - 2021-10-25 19:02:10