0

我已经设法让我制作的图像出现在默认标题徽标旁边的 woostore 主题标题中，但是图像和页面顶部之间出现了很大的差距，我认为这实际上是造成的以某种方式通过徽标。我不擅长编码只是有点反复试验，所以有人可以看看并告诉我该怎么做吗？

下面是具体的标头代码：

<?php } ?>

 <div id="header" class="col-full">

 <div id="logo">
 <div id="headbanner" style="height:500px; width:186px; position:relative; top:500px; left:275px;">
 <img src="http://aggidukes.co.uk/store/wp-content/uploads/2013/04/Store-header-Image.png" alt="Official Store" /></div>

和网站地址：http ://aggidukes.co.uk/store/

4

2 回答 2

0

在#headbanner 中只给浮动删除其他。

#headbanner{float:right;}
#search-top{float:right; clear:both;}
于 2013-04-11T13:40:10.557 回答
0

这是你目前拥有的。

#headerbanner{
  height: 500px;
  width: 186px;
  position: relative;
  top: 500px;
  left: 275px;
}

将其更改为：

#headerbanner{
  float: left;
  margin: 0 0 0 198px;
}

给 id 为“Logo”的 div 100% 宽度。

<div id="logo" style="&nbsp; &nbsp; width: 100%;">                                  
</div>

此外，您应该像这样重新排列您的徽标和标题横幅。

<a href="http://aggidukes.co.uk/store/" title="" style="float: left;"><img src="http://aggidukes.co.uk/store/wp-content/uploads/2013/03/Logo.png" alt="Aggidukes Official Store"></a>
<div id="headbanner" style="float: left; margin: 0 0 0 198px;"><img src="http://aggidukes.co.uk/store/wp-content/uploads/2013/04/Store-header-Image.png" alt="Official Store"></div>

包装徽标的链接应为“float:left;”

最终结果应该看起来像

<div id="header" class="col-full">
  <div id="logo" style="width: 100%;"> <a href="http://aggidukes.co.uk/store/" title="" style="float: left;"> <img src="http://aggidukes.co.uk/store/wp-content/uploads/2013/03/Logo.png" alt="Aggidukes Official Store"></a>
    <div id="headbanner" style="float: left;  margin: 0 0 0 198px;"> <img src="http://aggidukes.co.uk/store/wp-content/uploads/2013/04/Store-header-Image.png" alt="Official Store"></div>
    <h1 class="site-title"><a href="http://aggidukes.co.uk/store/">Aggidukes Official Store</a></h1>
    <span class="site-description"></span> </div>
  <!-- /#logo -->
  <div id="search-top">
    <form role="search" method="get" id="searchform" class="searchform" action="http://aggidukes.co.uk/store">
      <label class="screen-reader-text" for="s">Search for:</label>
      <input type="text" value="" name="s" id="s" class="field s" placeholder="Search">
      <input type="image" class="submit btn" name="submit" value="Search" src="http://aggidukes.co.uk/store/wp-content/themes/woostore/images/ico-search.png">
      <input type="hidden" name="post_type" value="product">
    </form>
    <div class="fix"></div>
  </div>
  <!-- /.search-top --> 
</div>
于 2013-04-11T13:59:06.610 回答