2013-10-21 39 views
0

我想爲每個決議放在不同的圖像。它適用於普通的屏幕和智能手機,但我無法讓它顯示出大屏幕分辨率。下面是代碼的相關章節:標題部分消失在大分辨率 - 媒體查詢

CSS:

/* Large screens ----------- */ 
@media only screen 
and (min-width : 1800px) { 
html { 
    background: #000000 url(images/blackmagic.png) no-repeat center center fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
} 

body { 
    background-color:transparent; 
    font-size: 100%; 
    color:#000000; 
} 

h1 { 
    color:#000000; 
    text-transform:uppercase; 
    font-family: 'Sancreek', Impact, sans-serif; 
    font-size:2.5em; 
} 

h2 { 
    font-family: 'Pathway Gothic One', Verdana, sans-serif; 
    font-size:1.875em; 
    color:#000000; 
} 

a:link { 
    color:#000000; 
} 

a:hover { 
    color:#9b0505; 
} 

p { 
    color:#000000; 
    font-family: 'Monda', Verdana, sans-serif; 
    font-size:0.875em; 
    text-align:justify; 
} 

#container { 
    position:relative; 
    width: 2200px; 
    margin: 0 auto; 
    z-index: 0; 
} 

#social { 
    position:relative; 
    margin-left: 450px; 
    z-index: 0; 
} 

#header { 
    display:none; 
    position:relative; 
} 

#headerm { 
    display:none; 
    position:relative; 
} 

#headerl { 
    position:relative; 
    z-index:1; 
    margin-top:-500px; 
    margin-left:200px; 
    width: 100%; 
} 

HTML:

<div id="container" class="outer"> 
     <div id="border" class="outer"> 
     <div id="header" class="inner"> 
      <img src="/images/header.png" id="headerimage" /> 
     </div> 
     <div id="headerl" class="inner"> 
      <img src="/images/headerlg.png" id="headerimage" /> 
     </div> 
     <div id="headerm" class="inner"> 
      <img src="/images/headerm.jpg" id="headerimage" /> 
     </div> 

回答

0

沒有HTML?另外發佈一個快速小提琴將使這更容易調試!

+0

我會更新它的HTML,但我已經完全搞砸了在這一點上...你可以在這裏查看它,如果查看源代碼會更容易? http://theshavebarber.com/about.php謝謝你花時間看看它,傑森!對此,我真的非常感激! – Meg1527

0

我其實只是想通了!

因爲我隱藏了常規桌面/筆記本電腦分辨率的DIV,並且沒有在其媒體查詢中爲該值定義最大寬度,所以它也將其隱藏在大分辨率媒體查詢中。

定義Standard Res的最大寬度值的簡單方法。

謝謝! :)