교육, 대외활동, 봉사/엘리스 AI 트랙 2기
[엘리스 AI 트랙 2기] Day 15 - 모바일 웹페이지
g0n1
2021. 7. 11. 15:17
728x90
모바일의 meta 태그
<meta name="viewport" content="width=device-width, initial-scale=1.0">
꼭 필요한 태그긴 하지만 어차피 vscode에서 html:5 엔터 하면 바로 써줘서 굳이 꼬박꼬박 외울 필요는 없을 것 같다.
position속성 비교
- static(디폴트) : 2차원 속성이다. 자식과 상호작용 없다.
- fixed: 3차원 속성이다. 사이드 메뉴, 헤더 등에 쓰인다.
- relative: 자신의 위치를 기준으로 움직인다.
- absolute: 부모의 상태(static이냐 relative냐)가 영향을 준다.
background-size
배경 이미지를 삽입할 때, 프레임을 꽉 채워 넣을지, 아니면 사진이 다 나오게 넣을지 하는 속성이다.
- contain: 이미지 유지
- cover: 여백없이 꽉 커버하게
background-attachment
- scroll: 내용을 스크롤해도 안 따라온다.
- fixed: position의 fixed처럼 화면에 고정되어 쭈욱 따라온다.
728x90