TIL#1 l HTML

vel.Ash·2022년 1월 16일
1
post-thumbnail

HTML

기본 role

  • 파일명, 폴더명은 항상 소문자로 작성되어야 한다
  • html 파일은 정해진 작성 형식과 문법이 있음
  • ! DOCTYPE html : 현재 파일이 html 파일이라는 것을 알림
  • html 문서는 크게 두 부분으로 나누어진다 1) head 2) body
    1) head : html 문서의 configuration을 주로 설정함 ex) title
    2) body : 웹사이트에서 contents를 보여주는 부분

Tag

*attribute = 태그에 추가하는 정보 혹은 속성
💡 한 tag 안에 여러개의 attributes를 동시에 사용할 수 있음

  • a = anchor : 추가적인 정보가 필요함
  • href, target : 링크 생성시 쓰는 태그
    🤔 target의 기본 값은 self 이고, _blank 입력시 새 탭에서 링크 열림
예시
<a href="http://google.com" target="_blank">Go to google</a> 
  • img : self closing tag, src과 함께 사용
    🤔 인터넷, 로컬 이미지 모두 가능, html 파일과 동일한 폴더에 넣고 파일명을 지정해주거나 다른폴더에 위치한다면 path notaion
예시
<img src="img/catimage.jpg" />
  • label : label은 input과 함께 작동 (label이 input을 activate)
    🤔 laber for="", input id="", 두 태그에는 완전히 똑같은 value가 들어가야함
예시
<label for=”profile”>Profile Photo</label>
<input id=”profile” type=”file” accept=”.png,.pdf” />
  • id : body 안에 어떤 태그에든 넣을 수 있는 attribute
    🤔 element당 단 하나의 id만 부여해야 함

display 속성

  1. inline
    : span, a, image, link (아주 작은 글이나 링크, 그림 등)
    : 높이와 너비가 없음
  2. block
    : div, p, head 등 (대부분의 box)
    : 높이와 너비가 있음
    : 특징 1) margin 2) padding 3) border
    🤔 inline과 block 속성은 바꿀 수 있음
profile
코린이의 개발공부

1개의 댓글

comment-user-thumbnail
2022년 1월 16일

정리가 잘되어있어요! 다음편도 올려주세요!

답글 달기