我想在页脚上方添加图片,如下图所示,或者您可以访问网站:http://creativelab.twofour54.com/en/

Example of the photo from TwoFour54

我正在测试的网站是wordpress。我尝试使用footer.php玩,但是效果很好,但是当我拉伸站点(放大或缩小)时,它就毁了。我试图通过CSS的位置标记将其设为静态,但这没有用。



<div class="cfa" style="margin-left: 200px; width: 100%; z-index: 10;">
	<div class="container">
		<div class="col-sm-12">
			<img src="http://localhost:8080/TESTWORDPRESS/wp-content/uploads/2017/01/Sketch-Book-icon.png">
		</div>
	</div>
</div>

<?php
 /*
 Template for Footer
 */
 ?>

		<footer id="footer">
			<div class="row clearfix">

                <?php

				if ( ! dynamic_sidebar ( 'footer_widgets' ) ){
					thdglkr_emptysidebar('Footer');
					}
				?>

			</div><!-- row -->

            <?php if (_option('footer_menu','1')=='1'){ ?>
			<div class="footer-last row mtf clearfix">
				<span class="copyright"><?php echo _option('footer_text'); ?></span>
                <?php
				wp_nav_menu(
					array(
						'theme_location' => 'secondary',
						'menu' => 'Footer Menu',
						'container'       	=> 'div',
						'container_class'  => '' ,
						'menu_class'	   => 'foot-menu',

					)
				);
			}else{?>

			<div class="footer-last row mtf clearfix center">
				<span class="copyright center"><?php echo _option('footer_text'); ?></span>

			<?php } ?>


			</div><!-- end last footer -->

		</footer><!-- end footer -->

	</div><!-- end layout -->
	</div><!-- end frame -->


	<?php if (_option('footer_gototop')==1): ?>
		<div id="toTop"><i class="icon-angle-up"></i></div><!-- Back to top -->
	<?php endif; ?>




<?php wp_footer(); ?>



</body>
</html>





注意:上面的代码是来自我的测试本地主机的Footer.php

有人有什么想法吗?

最佳答案

.cfa放在html的页脚内。在您的CSS中:

.cfa {
position: absolute;
top: 0;
left: 200px;
margin-top: -100px; //change this to the height of your image
}


编辑:实际上,最好将其从HTML中删除,如果只是出于设计目的,则使用:before伪元素通过css将其添加。

07-24 09:47
查看更多