2013-12-24 5 views
0

ipad 또는 iphone에서 div를 두 개 표시하고 div를 하나 표시하고 싶습니다. 미디어 쿼리로 작업하는 동안 두 div를 숨길 수 있었지만 표시하고 싶은 코드는 ipad 또는 iphone에 사용하고있는 코드가 표시되지 않습니다.Iphone Ipad에 대한 미디어 쿼리

<link media="all and (min-device-width: 481px) and (max-device-width: 800px) and (orientation:landscape)" href="/cs_common/css/ipad/ipad-landscape.css" rel="stylesheet" type="text/css" /> 


<link media="all and (min-device-width: 481px) and (max-device-width: 800px) and (orientation:portrait)" href="/cs_common/css/ipad/ipad-portrait.css" rel="stylesheet" type="text/css" /> 

<link media="all and (max-device-width: 480px)" href="/cs_common/css/ipad/iphone.css" rel="stylesheet" type="text/css" /> 


<style> 
    .newrugtoolsel 
{ 

    visibility:hidden; 

    } 

    .newrugsearch 
    { 
     visibility:hidden; 
    } 
    .bottom 
    { 
     display:block; 



    } 

</style> 


<html> 
<div class="bottom" style=" width:100%; height:80px; background-color:blue; position: fixed; left:0px; bottom:0px; display:none;"> This is the div i want to show on ipad or iphone and hide on desktop </div> 
</html 

내가 보여주고 싶은 사업부 당신은 전체 사이트에 대한 당신 스타일 후 스타일 시트를 연결하기 위해 필요하거나 태그는 미디어 스타일 시트의 말보다 우선합니다

답변

1

.bottom입니다.

<style> 
    .newrugtoolsel 
{ 

    visibility:hidden; 

    } 

    .newrugsearch 
    { 
     visibility:hidden; 
    } 
    .bottom 
    { 
     display:block; 



    } 

</style> 

    <link media="all and (min-device-width: 481px) and (max-device-width: 800px) and (orientation:landscape)" href="/cs_common/css/ipad/ipad-landscape.css" rel="stylesheet" type="text/css" /> 


<link media="all and (min-device-width: 481px) and (max-device-width: 800px) and (orientation:portrait)" href="/cs_common/css/ipad/ipad-portrait.css" rel="stylesheet" type="text/css" /> 

<link media="all and (max-device-width: 480px)" href="/cs_common/css/ipad/iphone.css" rel="stylesheet" type="text/css" /> 
0

먼저 CSS를 스타일 시트에 넣습니다. HTML 페이지에서 제거하고 다른 스타일 시트에 모두 넣으십시오.

생각하고있는 방식대로 작동해야하지만 HTML 대신 모든 스타일 시트에서 지정해야합니다.

+0

HTML 형식이 아니라 클래스 형식이어야합니다. .Bottom은 @Ben이 말한 것처럼 클래스를 설정하고 스타일을 지정하는 것이며 css를 재정의합니다.) – sunto