在wordpress中的CSS翻轉標誌

我試圖在Wordpress標頭標誌上應用CSS圖像翻轉。我知道這對你們來說是一個非常簡單的解決方案，但我似乎無法在Stackoverflow的任何地方找到答案。我認爲這可能與位置有關，但添加：親戚或絕對似乎沒有區別？下面在wordpress中的CSS翻轉標誌

是我的CSS

#top { 
height: 105px; 
padding-left: 10px; 
padding-top:27px; 
} 
#logo { 


/* background-attachment: scroll; 
background-image: url(images/logo.png); 
background-repeat: no-repeat; 
background-position: left top;*/ 
height: 70px; 
width: 461px; 
} 

#logo a:hover { 

background-attachment: scroll; 
background-image: url('images/flatgrey.png'); 
background-repeat: no-repeat; 
background-position: left top;*/ 
height: 70px; 
width: 461px; 


} 

#logo a { 

display:block; 
height: 70px; 
width: 461px;

& PHP

<body <?php body_class(); ?>> 

<div id="outer"> 
    <div id="top"> 
     <div id="logo"> 
      <?php    
      ob_start(); 
      ob_implicit_flush(0); 
      echo get_option('imbalance_custom_logo'); 
      $my_logo = ob_get_contents(); 
      ob_end_clean(); 
      if (
      $my_logo == '' 
      ): ?> 
      <a href="<?php bloginfo("url"); ?>/"> 
      <img src="<?php bloginfo('template_url'); ? >/images/logo.png" alt="<?php bloginfo('name'); ?>" /></a> 
      <?php else: ?> 
      <a href="<?php bloginfo("url"); ?>/"><img src="<?php echo  get_option('imbalance_custom_logo'); ?>" alt="<?php bloginfo('name'); ?>" /></a>    
      <?php endif ?>

來源

2011-01-21 user557318

我拿出背景附件和背景位置線#logo，所以#logo的風格是這樣的：

#logo { 
background-image: url(images/logo.png); 
background-repeat: no-repeat; 
height: 70px; 
width: 461px; 
}

這似乎爲我工作。它能解決你的問題嗎？

來源

2011-02-05 17:13:17 TheLibzter

我假設你想flatgrey.png上側翻更換logo.png。如果是這種情況，你應該擺脫整個<img src=".../images/logo.png"...>標記，然後將 background-image: url('images/logo.png');添加到#logo a的CSS。您還需要將background-repeat: no-repeat;行從#logo a:hover的CSS移至#logo a。

來源

2011-01-21 02:58:13 sfarbota

在wordpress中的CSS翻轉標誌

回答

相關問題