웹 모바일 응용 프로그램에 대한 응답 설계

Question

안녕하세요, im은 웹 응용 프로그램을 구현하고 내 문제는 디자인입니다. 응용 프로그램이 웹 사이트로 실행되고 있습니다. 지금 내가 발견 한 것은 미디어 쿼리이며 1920x1080 노트북, 480x720 모바일 및 768x1024 태블릿에 사이트를 표시하는 데 사용합니다. 내가 뭘

줌을 변경하고

아래

@media 만 화면과 같은 다른 해상도의 사이트를 표시하는 것입니다 (최소 폭 : 768px) 및 (최대 폭 :가 1024px)와 (오리엔테이션 : 풍경) {body {zoom : 35 %;}}

다른 방법이 있습니까? 어떤 API를 사용할 수 있습니까? 또는 Javascript? 모바일 및 태블릿 해상도를위한 CSS를 구현하기 때문에 지금 당장 뭔가 간단하게하고 싶습니다. 2,3 일 동안 기기를 테스트 했으니까요. 나는이 사이트를 응답해야하는 기기를 필요로하는 무언가를 원합니다. . 나는 그것이 모든 곳에서 일하기를 원한다.

미리 감사드립니다.

Answer 1

Foundations 및 Twitter bootstrap을 살펴보십시오. 이들은 화면의 크기에 따라 페이지의 요소를 자동으로 재배치하고 크기를 조정하는 실시간 반응 형 CSS 라이브러리입니다. 이러한 링크를 방문하고 브라우저 창 크기를 조정하면이 사실을 알 수 있습니다. 이것은 모든 화면 크기에 대해 다른 스타일을 쓰지 않아도 페이지 자체를 처리하기 때문에 프로젝트에 적합하다면 갈 수있는 좋은 방법입니다. 그들이 어떻게 작동하는지 보려면 this page을보십시오. 을 살펴보십시오 그것이하는 일은 페이지를보기 위해 어떤 종류의 장치를 사용하고 어떤 기능을 지원하는지 감지 한 다음 지원하는 기능을 페이지 클래스의 body 태그에 추가합니다. 그러면 CSS 스타일을 작성할 수 있습니다. 예를 들어 사용자가 터치 스크린 장치에서 사이트를보고있는 경우 다음과 같이 작성할 수 있습니다.

.touch 부여됨 수준의 {

}

이 그것은뿐만 아니라 화면 크기를 감지하는 데 사용할 수 있습니다

: 내가 대답하는 템플릿을 얻을 수있는 프레임 워크를 필요 없어요 https://stackoverflow.com/a/16482237/1727920