2015-04-06 118 views
1

我需要使用引導3.我寫了下面的HTML代碼到中心的IMG圈格內glyphicon到中心的圓內glyphicon:如何使用引導3

<section> 
     <div class="container"> 
      <div class="col-lg-4"> 
       <div class="img-circle center-block"> 
        <span class="glyphicon glyphicon-map-marker glyphicon-aligned-center"></span> 
       </div> 
       <p class="aligned-paragraph-address text-center">#123 45678 901 <br/> St NW Pellentesque habitant</p> 
      </div> 
     </div> 
</section> 

在CSS我寫了下面的代碼:

.img-circle { 
    width: 125px; 
    height: 125px; 
    background-color: #f5c63b; 
} 

.aligned-paragraph-address { 
    padding: 1em; 
} 

.glyphicon-envelope, .glyphicon-phone, .glyphicon-map-marker { 
    font-size: 50px; 
    color: #ffffff; 
} 

.glyphicon-aligned-center { 
    top: 35px; 
    left: 35px; 
} 

它的工作,但我不覺得這是最好的做法。所以我需要一個幫助來做一個專業人士。

回答

0

通常當我需要中心的東西,我使用餘量:0汽車;

你也可以把它寫成margin-left:auto; margin-right:auto;

但是第一個解決方案是代碼少。如果是文本,你可以嘗試text-align:center;

祝你好運。讓我知道這是否適合你。