边距分辨率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

回答

相关问题