在页面中输入页脚内容 [英] Put footer content in columns
本文介绍了在页面中输入页脚内容的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
您好我目前正在为我的网站做一个页脚我写这个代码,一切正常,除了第二行在屏幕的第一行和底部的一半的事实,我需要第二行到第一行的右边可以任何人帮助感谢!
在此输入图片描述
Hello I am currently trying to make a footer for my website I write this code and everything works fine except the fact that the second row is under the first row and half of the bottom of the screen I need the second row to be to the right of the first row can anyone help thanks! enter image description here
<div class="footer">
<div class="container">
<div class="row">
<div class="col-md-6">
<h4>Links</h4>
<li><a href="index.html">Home</a></li>
<li><a href="courses.html">Courses</a></li>
<li><a href="sign-up.html">Sign Up</a></li>
<li><a href="log-in.html">Log In</a></li>
<li><a href="help.html">Help</a></li>
</div>
<div class="col-md-6">
</div>
</div>
<div class="row">
<div class="col-md-6">
<h4>Social Media</h4>
<li><a href="#">Facebook</a></li>
<li><a href="#">Twitter</a></li>
<li><a href="#">Youtube</a></li>
<li><a href="#">Instagram</a></li>
</div>
</div>
</div>
</div>
推荐答案
我相信你使用的是bootstrap,所以没有必要
I believe you are using bootstrap so no need for fancy css, this html will do the trick for you.
但是请注意,当屏幕小于x像素(我相信376px但不确定)时,这两列将会
But be aware that when the screen is smaller that x pixels ( I believe 376px but not sure) the two columns will overlap each other.
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<div class="footer">
<div class="container">
<div class="row">
<div class="col-sm-6">
<h4>Links</h4>
<li><a href="index.html">Home</a></li>
<li><a href="courses.html">Courses</a></li>
<li><a href="sign-up.html">Sign Up</a></li>
<li><a href="log-in.html">Log In</a></li>
<li><a href="help.html">Help</a></li>
</div>
<div class="col-sm-6">
<h4>Social Media</h4>
<li><a href="#">Facebook</a></li>
<li><a href="#">Twitter</a></li>
<li><a href="#">Youtube</a></li>
<li><a href="#">Instagram</a></li>
</div>
</div>
</div>
</div>
</body>
</html>
这篇关于在页面中输入页脚内容的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文