Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/css/38.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/4/webpack/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Html 使用引导4创建居中的页脚_Html_Css_Twitter Bootstrap_Bootstrap 4 - Fatal编程技术网

Html 使用引导4创建居中的页脚

Html 使用引导4创建居中的页脚,html,css,twitter-bootstrap,bootstrap-4,Html,Css,Twitter Bootstrap,Bootstrap 4,我正在努力学习Bootstrap,尤其是bootstrap4,但我的页脚很难掌握 它有两行,我想让整个东西居中,但挣扎 下面是我目前拥有的HTML <section class="block-follow-us"> <div class="container"> <div class="row align-items-center justify-content-center"> <div class="c

我正在努力学习
Bootstrap
,尤其是
bootstrap4
,但我的页脚很难掌握

它有两行,我想让整个东西居中,但挣扎

下面是我目前拥有的HTML

<section class="block-follow-us">
    <div class="container">
        <div class="row align-items-center justify-content-center">
            <div class="col-4 col-md-1 px-0">
                <span class="h5">Follow us:</span>
            </div>
            <div class="offset-1 col-10 offset-md-0 col-md-3 px-0">
                <a href="https://twitter.com/ApolloSciUK?ref_src=twsrc%5Egoogle%7Ctwcamp%5Eserp%7Ctwgr%5Eauthor" target="_blank" class="fab fa-twitter-square"></a>
                <a href="https://www.linkedin.com/company/apollo-scientific-ltd" target="_blank" class="fab fa-linkedin"></a>
                <a href="https://www.instagram.com/apolloscientific/?hl=en" target="_blank" class="fab fa-instagram"></a>
                <a href="https://www.facebook.com/pages/Apollo-Scientific-Ltd/158179738244405?rf=174620749220860" target="_blank" class="fab fa-facebook-square"></a>
            </div>
        </div>
    </div>
</section>

<footer class="footer">
    <div class="container-fluid">
        <div class="row text-center">
            <div class="col-12">© 2019 - Apollo Scientific Ltd</div>
        </div>
        <div class="row justify-content-center text-center">
            <div class="col-12 col-md-2">
                <a href="/">Terms and conditions</a>
            </div>                        
            <div class="col-12 col-md-2">
                <a href="/">Privacy policy</a>
            </div>                        
            <div class="col-12 col-md-1">
                <a href="/">Careers</a>
            </div>
        </div>
    </div>        
</footer>

请跟随我们:
©2019年-阿波罗科学有限公司
它看起来像桌面上的下图,但所有的部分都在这个地方,我已经试了几个小时来整理它

不过手机看起来不错


请跟随我们:
©2019年-阿波罗科学有限公司

无法从stackoverflow的移动版本写入代码。我很抱歉。@DogukanCavus-不知道你的意思。希望不是你投了反对票,因为这是一个有效的帮助问题
<section class="block-follow-us">
 <div class="container">
   <div class="row align-items-center justify-content-center">
     <div class="col-lg-12 col-md-12 text-center">
      <span class="h5">Follow us:</span>
       <a href="https://twitter.com/ApolloSciUK?ref_src=twsrc%5Egoogle%7Ctwcamp%5Eserp%7Ctwgr%5Eauthor" target="_blank" class="fab fa-twitter-square">Link1</a>
       <a href="https://www.linkedin.com/company/apollo-scientific-ltd" target="_blank" class="fab fa-linkedin">Link2</a>
       <a href="https://www.instagram.com/apolloscientific/?hl=en" target="_blank" class="fab fa-instagram">Link3</a>
       <a href="https://www.facebook.com/pages/Apollo-Scientific-Ltd/158179738244405?rf=174620749220860" target="_blank" class="fab fa-facebook-square">Link4</a>
     </div>
   </div>
 </div>
</section>

<footer class="footer">
 <div class="container-fluid">
  <div class="row text-center">
   <div class="col-lg-12">© 2019 - Apollo Scientific Ltd</div>
  </div>
  <div class="row justify-content-center text-center">
   <div class="col-lg-4">
    <a href="/">Terms and conditions</a>
   </div>                        
   <div class="col-lg-4">
    <a href="/">Privacy policy</a>
   </div>                        
   <div class="col-lg-4">
    <a href="/">Careers</a>
   </div>
  </div>
 </div>        
</footer>