邊距分辨率CSS

我想「despre NOI」下面要移動的對象......像這幅畫

http://i59.tinypic.com/6i5krr.jpg

這是CSS代碼：

#top 
{ 
    background-image:url(img/DESPRE-NOI.png); 
    width:400px; 
    height:38px; 
    margin-left:36%; 
}

code HTML：

<div id="main">     
       <div id="patrat"> 
       </div> 

       <div id="logo-theme"> 
         <a href="<?php echo esc_url(home_url('/')); ?>"> 
          <img src="<?php echo get_template_directory_uri() . '/img/LOGO.png'; ?>" alt="<?php bloginfo('name'); ?>" /> 
         </a> 
        </div> 

        <div id="text-logo"> 
        <h1>CABINET AVOCAT CODOBAN</h1> 
        </div> 

        <div id="container">      
        <div id="top"></div> 
         <div id="mid" style="display: none;"> 
     <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut   enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p> 
         </div> 
        </div></div>

如果適用的話「的margin-top：311px;」在1440x900分辨率下看起來不錯...但不支持1366x768分辨率

這是Wordpress的主題。

有什麼方法可以解決它嗎？

在此先感謝！

來源

2015-02-09 Diaconescu Cristiasn

你可以創建一個jsfiddle嗎？ – Nick 2015-02-09 12:17:35

使用媒體查詢指定768高度上的頁邊距。

來源

2015-02-09 12:18:38

-1

您應該使用percentaje而不是像素來設置寬度和高度，與邊距一樣。爲了使它響應這個簡單的舉動，你可以按照正確的比例。 percentage = target/context這意味着，如果你的目標（您設置的百分比的元素）爲200像素，你的上下文（你的元素的paretn元素）爲400像素，那麼你的比例應爲200/400 = 0.5 => 50%

來源

2015-02-09 12:22:48

我把margin-top：20％，同樣的事情發生 – 2015-02-09 12:26:19

你的'寬度'和'高度'？如果這些仍然以像素爲單位，結果總是相同的。無論如何，如果沒有這些作品，你應該使用媒體查詢，如之前說的 – 2015-02-09 12:28:03

我從來沒有使用queris媒體......將不得不研究 – 2015-02-09 12:31:29

嘗試這樣的：

@media screen and (min-width: 1366px) { 
#top { 
    margin-top: 311px; 
} 
} 

@media screen and (min-width: 1024) { 
------code goes here ------- 
}

來源

2015-02-09 12:33:30

#top { 
margin-top: 311px; 
background-image:url(img/DESPRE-NOI.png); 
width:400px; 
height:38px; 
margin-left:36%; 
} 

@media screen and (min-width: 1366px) { 
#top { 
    margin-top: 311px; 
} 
} 

@media screen and (min-width: 1024px) { 
#top { 
    margin-top: 2%; 
} 
}

所以它應該？我不工作

來源

2015-02-09 12:52:24

邊距分辨率CSS

回答

相關問題