일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
Tags
- react
- 자료구조
- 비동기
- 계명대
- 힛잇
- hokidoki
- 스위프트
- 자스민
- data structure
- queue
- jest
- 자바스크립트
- 자바스크립트 자료구조
- 스벨트
- 개발
- Svelte
- HTML
- 개발자
- 계명대 이종호
- IOS
- Hitit
- 호키도키
- 리액트
- hokeys
- TDD
- 호키스
- SWIFT
- 리액트 예제
- javascript
- 이종호
Archives
- Today
- Total
목록반응형 웹 (1)
Dog foot print
[css]반응형 웹을 만들기 위한 media-query
2007년 현재는 고인이 된 스티브잡스가 it의 생태계를 완전히 뒤집는 아이템인 아이폰을 선보였다. 이 아이폰의 등장으로 인해서 웹디자이너들은 고민에 빠졌는데 바로 작은 디스플레이에서 기존의 웹은 너무 크고 불편하다는 것이였다. 그래서 작은 디스플레이에 맞게 웹을 새로 만들어야했다. 그래서 디자이너들이 할 수 있는 결정은 두 가지였다. 디바이스의 크기를 보고 새로운 페이지를 연결해주거나 기존 페이지에 미디어 쿼리를 활용 해 디바이스에 따라 css가 다르게 반응 하게 하는 것이였다. 미디어 쿼리의 사용 기본적인 media query의 사용이다. @media("크기"){} 형태로 작성이 되며 각 블록에 작성된 스타일은 미디어 쿼리에 적용된 한계를 벗어나면 적용되지 않는다. min-width, max-widt..
CSS
2019. 7. 8. 20:00