Question

使用媒体查询我试图隐藏桌面立方体的图像，然后将其替换为立方体的另一个iphone图像.... 我可以隐藏iphone的桌面图像但是iphone图像没有显示..... 如何解决这个问题......

http://jsfiddle.net/QYvrt/27/embedded/result/

在下面提供我的代码

<div class="desktopContactImage" data-caption="&lt;a style='margin-left: 92px; font-size: 18px; color: grey;' href='http://www.w3schools.com/' &gt;Create&lt;/a&gt; &lt;div&gt; &lt;a style='margin-left: 92px; font-size: 18px; color: grey;' &gt;View/Edit&lt;/a&gt; &lt;/div&gt; &lt;a style='margin-left: 92px; font-size: 18px; color: grey;' &gt;Labels&lt;/a&gt;" data-image="http://www.defie.co/designerImages/inventoryControl.png">desktopImage</div>

 <div class="iphoneContactImage" data-caption="&lt;a style='margin-left: 92px; font-size: 18px; color: grey;' href='http://www.w3schools.com/' &gt;Create&lt;/a&gt; &lt;div&gt; &lt;a style='margin-left: 92px; font-size: 18px; color: grey;' &gt;View/Edit&lt;/a&gt; &lt;/div&gt; &lt;a style='margin-left: 92px; font-size: 18px; color: grey;' &gt;Labels&lt;/a&gt;" data-image="http://intra.defie.co/images/cubes/demoImage.png">iphoneImage</div>






@media (max-width: 767px) {

#rightSlider{
    border: 1px solid red;
}

#rightSlider{
            display:none !important;
          }
#rightSlider{ 
            display:inherit !important;
          }

.desktopContactImage{

            display:none !important;
          }

.iphoneContactImage{
            display:inherit !important;
            border: 1px solid red;
          }



}

#slidenav{
            display:none !important;
          }
#slidenav{ 
            display:inherit !important;
          }

}

@media (min-width: 768px) and (max-width: 979px) {

#rightSlider{
    border: 1px solid green;
}


}






/* Demo styling */
#rightSlider{
        display: none;
      }
#slidenav{
        display: none;
      }



     .iphoneContactImage{
        display: none;
      }

Answer 1

取代使用display：inherit！important取消隐藏您可能想要尝试的元素

.iphoneContactImage{
  display:block;
  border: 1px solid red;
}

如果这不起作用，您可以尝试这里提到的更多技巧：Transitions on the display: property

隐藏iphone屏幕的图像

1 个答案: