# 반응형웹
[클론코딩 :: CUBE ME] 반응형 웹 클론코딩 완성
회사에서 웹디자이너 + 퍼블리셔로 일하다가 퇴사 후,몇개월 동안은 리액트나 JS 위주의 개념을 잡고 공부하느라html, css 마크업 코딩을 꽤 안했다고 생각이 들어서 시작하려니 겁이 좀 났었다감을 잃었으면 어쩌지.. 하는 근심이 조금 있었는데막상 시작하고보니 역시나
반응형 웹 vs 적응형 웹
" 반응형 웹과 적응형 웹의 차이를 설명하세요 "면접에서 들었던 질문 중에 하나였다.반응형 웹만 알고 있던 나는너무 당황했었고 이렇게 두개를 비교해서 정리하기로 했다!(공부를 더 열심히 해야겠다고 다짐했던 계기가 되었..🤣)Mobile First!화면크기 변화에 따라
[8] Color, Custom Property, Media Query
컬러 시스템 0. 브라우저가 인식하는 컬러 이름 blue, red 등 1. 컬러코드 16진수 컬러 시스템 2. RGB 세 가지 값(red, green, blue)을 입력 3. RGBA RGB에 투명도를 나타내는 알파를 추가 Custom Property 변수를
[5] Flexbox, 부모 자식
Flexbox 반응형이 불가능한 inline-block 의 단점을 보완하기 위한 방법. 3가지 규칙이 있다. 1. 부모 요소에만 적어야 함. 적용하고자 하는 요소의 직접 부모 요소를 flex로, 즉 flex 컨테이너로 만들어야 함 ! 자식 요소에는 아~무것도 적지
2020/12/28 - to do list
기술 면접용 단어 정리 >> 자기 전에 읽기V 영어공부 : 스픽으로 1시간 스피킹 한 유닛V 운동 30분V 프로젝트 진행회의: 각자 완성한 개인 기능부분 스토리보드 발표스토리 보드 공통부분 완성 header, footer, main 완성반응형 웹이므로 모바일 버전도
[반응형 웹] 2. Fluid Grid / Media Query & Viewport / Flexible Box 기본개념
반응형 웹에 필요한 기술들의 기본개념을 정리했습니다.
반응형 웹,Media Query(미디어쿼리)
웹사이트에서 PC, 스마트폰, 태블릿 PC 등 접속하는 디스플레이의 종류에 따라 화면의 크기가 자동으로 변하도록 만든 웹페이지 접근 기법을 말한다. 웹사이트를 PC용과 모바일용으로 각각 별개로 제작하지 않고, 하나의 공용 웹사이트를 만들어 다양한 디바이스에 대응할
뷰포트부터 반응형 웹까지 개념정리
웹 페이지내에서 브라우저 화면상에서 실제 표시되는 영역을 뷰포트라고 합니다.뷰포트는 장치에 따라 다릅니다.모바일 화면에서는 작고, 컴퓨터 스크린에서는 보다 큰 영역을 가지고 있습니다.스마트폰과 태블릿의 전성시대 이전의 기성 웹사이트들은 오직 컴퓨터 스크린에만 맞춰서 디
반응형웹의 가변 그리드 , max와 min
가변 그리드는 웹사이트를 제작할 때 화면의 크기에 관계없이 자유롭게 늘어나거나 줄어들 수 있도록 픽셀 설정 값이 아닌 퍼센트(%) 설정 값 또는 가변 그리드 단위로 제작하는 기술이다.가변 그리드 마다 계산하는 공식이 존재하고 공식이 모두 다르다.가변 그리드의 단위들vw
반응형 웹의 미디어 쿼리 (Media Query) 와 Viewport
반응형 웹(Responsible Web)이란 디바이스(전자기기)별로 각각 레이아웃(grid)가 달라지는 웹이다.쉽게 설명하자면 화면의 크기 마다 레이아웃이 달라진다.반응형 웹에서는 필수인 미디어쿼리는, 화면크기 마다 각각 다르게 CSS를 적용하는 것이다.화면 사이즈를