0

我正在尝试在 Wordpress 标题徽标上应用 CSS 图像翻转。我知道这对你们来说将是一个非常简单的解决方案，但我似乎无法在 Stackoverflow 的任何地方找到答案。我认为这可能与位置有关，但添加 :relative 或 :absolute 似乎没有区别？

下面是我的 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 ?>
4

2 回答 2

0

我假设您想在翻转时用 flatgrey.png 替换 logo.png。如果是这种情况，你应该去掉整个<img src=".../images/logo.png"...>标签，然后添加 background-image: url('images/logo.png');到#logo a. 您还需要将background-repeat: no-repeat;行从 CSS#logo a:hover移至#logo a。

于 2011-01-21T02:58:13.500 回答
0

我取出了#logo 的背景附件和背景位置线，所以#logo 的样式是这样的：

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

这似乎对我有用。它解决了你的问题吗？

于 2011-02-05T17:13:17.887 回答