如何中心H5与UL

我的页脚中的下一个代码：如何中心H5与UL

HTML：

<div class="container"> 
<div class="row"> 
     <div class="col-md-6"> 
      <div class="pull-right"> 
       <h5><u><i>Informacion</i></u></h5><br /> 
       <ul style="list-style-type: none;"> 
        <li><a href="#">Acerca de Nosotros</a></li> 
        <li><a href="#">Contactanos</a></li> 
        <li><a href="#">Ubicacion</a></li> 
        <li><a href="#">Trabaja con Nosotros</a></li> 
        <li><a href="#">Prensa</a></li> 
       </ul> 
      </div> 
     </div> 
     <div class="col-md-3"> 
      <div class="pull-right"> 
       <h5><u><i>Social</i></u></h5><br /> 
       <ul style="list-style-type: none;"> 
        <li><a href="#"><img class="imgFooter" src="~/Content/img/Social/fb.jpg" alt="FB" /></a></li><br /> 
        <li><a href="#"><img class="imgFooter" src="~/Content/img/Social/twitter.png" alt="FB" /></a></li><br /> 
        <li><a href="#"><img class="imgFooter" src="~/Content/img/Social/Linkedin.png" alt="FB" /></a></li> 
       </ul> 
      </div> 
     </div>

随着HTML进行测试的CSS样式定义。问题来了，我无法实现h5中心文本攻击。如果我在h5中使用文本对齐，它只适用于第一个ul（假设文本的长度）。

在此先感谢。

来源

2017-10-17 Elias MP

从UL删除内嵌样式style="list-style-type: none;"并添加引导类list-unstyled重置缺省UL风格即margin, padding，比把text-center类的父元素，使所有儿童中心。

<div class="container"> 
<div class="row"> 
     <div class="col-md-6 text-center"> 
      <div class="pull-right"> 
       <h5><u><i>Informacion</i></u></h5><br /> 
       <ul class="list-unstyled"> 
        <li><a href="#">Acerca de Nosotros</a></li> 
        <li><a href="#">Contactanos</a></li> 
        <li><a href="#">Ubicacion</a></li> 
        <li><a href="#">Trabaja con Nosotros</a></li> 
        <li><a href="#">Prensa</a></li> 
       </ul> 
      </div> 
     </div> 
     <div class="col-md-3 text-center"> 
      <div class="pull-right"> 
       <h5><u><i>Social</i></u></h5><br /> 
       <ul class="list-unstyled"> 
        <li><a href="#"><img class="imgFooter" src="~/Content/img/Social/fb.jpg" alt="FB" /></a></li><br /> 
        <li><a href="#"><img class="imgFooter" src="~/Content/img/Social/twitter.png" alt="FB" /></a></li><br /> 
        <li><a href="#"><img class="imgFooter" src="~/Content/img/Social/Linkedin.png" alt="FB" /></a></li> 
       </ul> 
      </div> 
     </div> 
    </div> 
</div>

Demo

来源

2017-10-17 10:37:08

它的工作原理！谢谢:) –

我不能...两分钟多....：P –

也许在两个孩子中心的文字？

.pull-right h5, 
.pull-right ul{ 
    text-align: center; 
}

来源

2017-10-17 10:36:17 pkolawa

最终样式不期望的。每个李有不同的长度，他们不对齐。 –

如何中心H5与UL

回答

相关问题