2014-11-26 5 views
-4

나는 초보자이고 사이트가있어 응답 성이 뛰어난 디자인을 만들고 싶지만 태블릿에서는 반응이 있지만 태블릿에서는 모바일이 아닌 태블릿 디자인을 만들고 싶습니다. 어떻게이 문제를 해결할 수 있도록 도와 주시겠습니까? 어쩌면 메타 뷰포트와 CSS 코드가 잘못되었거나, 최소 또는 최대 미디어 너비를 만들려는 픽셀이 몇 개인가? 이 내 더미 사이트 http://silanycorp.com/a태블릿에서 반응이 없음

체크 반응 레이아웃 http://ami.responsivedesign.is/#

메타 뷰포트

<meta name="viewport" content="width=device-width, initial-scale=1"> 

CSS 코드

@media (max-width: 768px) { 
.container{ 
    padding:0; 
} 
.logo{ 
    padding-left:0; 
} 
.hide-on-desktop{ 
    display:block 
} 
.header-wrapper{ 
    padding: 0; 
} 
.header-outer{ 

}이 사이트입니다

도움을 주셔서 감사합니다.

+0

라이브 링크를 게시하지 말고 (대신에) 관련 코드를 질문에 게시하십시오. 그러면 길 아래 사람들이 당신에게 주어진 답을 얻을 수 있습니다. 감사! –

+0

나쁜 소년과 모든 문제는 부트 스트랩 – LOTUSMS

+0

이것은 그리드 시스템이나 열을 사용하지 않습니다 – user3154864

답변

2

사용자가 가지고있는 뷰포트 너비에 따라 여러 개의 스타일 시트를로드 할 수 있습니다.

<link rel='stylesheet' media='screen and (min-width: 701px) and (max-width: 900px)' href='css/medium.css' /> 

또한이 같은과 스타일 시트에 설정할 수 있습니다 : 여기

@media all and (max-width: 699px) and (min-width: 520px) { 
    #sidebar ul li a { 
    padding-left: 21px; 
    background: url(../images/email.png) left center no-repeat; 
    } 
} 

프로세스에 대한 좋은 기사입니다 :

다음과 같은 태그로 수행 할 수 있습니다 http://css-tricks.com/css-media-queries/

+0

나는 이것을 시도합니다, 감사합니다 :) – user3154864

관련 문제