将图像定位在页脚的某个点

时间:2014-01-20 19:41:02

标签: php html css wordpress footer

我在尝试将图片放在页脚上的徽标旁边时遇到了很多麻烦。我的网站是http://anbhialann.ie。这是在wordpress上。

我想要放置在徽标旁边的图片是:http://anbhialann.ie/wp-content/uploads/2014/01/Menu-Pages-Badge.png

请问有人可以建议我吗?

以下是代码:

页脚html / php代码的代码是:

<footer>

    <div class="width-container">

        <div id="copyright">
            <div class="grid2column">
            <?php if(of_get_option('footer_logo', 'get_template_directory_uri() . "/images/logo-footer.png"')): ?>
                <a href="<?php echo home_url( '/' ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home" id="footer-logo"><img src="<?php echo of_get_option('footer_logo', get_template_directory_uri() . '/images/logo-footer.png'); ?>" width="<?php echo of_get_option('footer_logo_width', '150'); ?>" alt="<?php bloginfo('name'); ?>"></a>
            <?php endif; ?>

            <?php if(of_get_option('footer_text')): ?>
                <div id="footer-text"><?php echo of_get_option('footer_text'); ?></div>
            <?php endif; ?>

            </div>

            <div class="grid2column lastcolumn">
                <?php wp_nav_menu( array('theme_location' => 'footer', 'depth' => 1, 'menu_class' => 'footer-menu') ); ?>
            </div>
        <div class="clearfix"></div>
        </div><!-- close #copyright -->

    <div class="clearfix"></div>
    </div><!-- close .width-container -->



</footer>

stylesheet.css是:

#footer-widgets .widget {font-size:12px;}
#copyright {border-top-style:solid; border-top-width:6px;   padding:20px 0px 20px 0px; width:100%; overflow:hidden;}
footer #copyright ul {margin:0px; padding:24px 0px 24px 0px; float:right; font-style:italic; }
#footer-text {font-size:12px; padding:5px 0px;}
footer #copyright ul a {text-decoration:none;}
footer #copyright ul li { margin-top:0px; margin-bottom:0px; display:inline; float:left; display:inline-block;  padding-right:15px; margin-right:15px;}
footer #copyright ul li:last-child { margin-right:0px; padding-right:0px;}
#copyright .lastcolumn {text-align:right;}

#footer-widgets .widget {float:left; margin-left:1.5%; margin-right:1.5%;}
#footer-widgets .footer-1-column .widget { width: 98%;}
#footer-widgets .footer-2-column .widget { width: 47%;}
#footer-widgets .footer-3-column .widget {width: 30%;  }
.lt-ie8 #footer-widgets .footer-3-column .widget {width: 29.5%;  }
#footer-widgets .footer-4-column .widget {width: 22%;  }


img.badges {position:absolute; bottom:0px; left:20px;}

由于 大卫

1 个答案:

答案 0 :(得分:1)

你不能像这样添加图像:

    <?php if(of_get_option('footer_logo', 'get_template_directory_uri() . "/images/logo-footer.png"')): ?>
                <a href="<?php echo home_url( '/' ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home" id="footer-logo"><img src="<?php echo of_get_option('footer_logo', get_template_directory_uri() . '/images/logo-footer.png'); ?>" width="<?php echo of_get_option('footer_logo_width', '150'); ?>" alt="<?php bloginfo('name'); ?>"></a>
            <?php endif; ?>

            <img src="http://anbhialann.ie/wp-content/uploads/2014/01/Menu-Pages-Badge.png" style="width: 100px;">