WIL 13주차

김동현·2023년 2월 5일
0

WIL

목록 보기
13/20

오늘은 미리 면접에 대한 내용을 정리 할까 생각중이다!

DNS - Domain Name System

도메인 주소를 IP주소로 변환해주는 시스템
sub-domain.domain.Top-level.domain

Sub-domain - www,m,store 등 제일 왼쪽을 뜻함
Top-level-domain - .com,.kr,.net 등 가장 오른쪽에 위치한 도메인

css

box model

  • 모든 HTML 요소는 박스 모양으로 구성되며, 이것을 박스 모델이라 부릅니다.
  • 박스 모델은 padding, border, margin, content로 구분됩니다!
    • margin : border 기준으로 바깥 부분을 의미합니다.
    • border : content와 padding을 감싸는 테두리입니다.
      - padding : border과 content 사이의 간격입니다.
      - content : 텍스트 or 이미지가 들어가 있는 실질적인 부분입니다!

display

  • 화면에 어떻게 드러나게 할지를 결정하는 속성입니다. 즉 요소 크기를 어떻게 결정할건지 결정하는 속성
  • display 속성값
    • none : 화면에서 사라집니다. 크기 자체도 차지하지 않습니다.
    • block : 설정하지 않아도 div가 갖게되는 기본값(하지만 태그에 따라 기본값이 다를수 있음)
    • inline : 컨텐츠를 딱 감쌀정도의 크기만 갖게됩니다. block 태그와 다르게 줄바꿈이 되지 않고 반드시 컨텐츠를 감싸게 되고, 크기 변화 X
    • inline-block : inline과 block의 특성을 합쳐놓은 속성/ 기본적으로 inline 속성을 지니지만 임의로 크기 변경 가능

position

  • HTML에서 element를 배치하는 방법을 지정하는 속성
  • position 속성값
    • static : position을 지정하지 않았을 때 기본으로 적용되는 값 / top,right,left, bottom, z-index 속성들의 효과가 안먹힌다!
    • relative : 원해 요소가 위치한 곳의 기준으로 움직입니다! static에서 사용 못한 속성 사용 가능
    • absolute : 부모태그를 기준으로 움직입니다. 단 부모 중에 position relative, fixed, absolute 가 하나라도 있으면 그 부모에 대해 절대적으로 움직입니다
    • fixed : 스크린의 뷰포트(현재 화면에 보여지고 있는 영역)를 기준으로 한 위치에 배치, 즉 nav bar 같은것을 구현할때 쓰임
    • sticky : fixed는 뷰포트 기준으로 배치되지만 sticky는 문서의 흐름을 따르면서 부모태그를 기준으로 상대적인 위치에 배치됩니다!

이후 내용은 계속추가할 예정이다!

profile
꺽이지 않는 마음

0개의 댓글