如何將按鈕與離子中的圖標對齊

我想將這些按鈕與文本對齊到正確的格式。我使用的離子和我想是這樣的引導與fa-fw 這裏怎麼給的代碼：

<div class="content padding"> 
     <button class="button button-block button-positive icon ion-log-in" ng-click="login(username, password)">&nbsp;Login</button> 
     <a class="button button-block button-transparent icon ion-ios-help-empty">&nbsp;Forgot Password</a> 
     <button class="button button-block button-stable icon ion-key" ng-click="register(username, password)">&nbsp;Register</button> 
</div>

來源

2016-02-17 Mani

可以置HTML與你的CSS ？ –

我正在使用離子。到目前爲止，還沒有定製的CSS。 – Mani

離子圖標，左，圖標，正確的類都可以用按鈕，你也用你的自定義CSS與按鈕獲取更多幫助，請轉至here。

例如，

<button class="button icon-left ion-home">Home</button> 
<a class="button icon-right ion-chevron-right button-calm">Learn More</a>

希望這將幫助你！

來源

2016-02-17 06:53:45

您可以使用離子類的內置類，如icon-left icon-right。如果您需要更多的靈活性與像FA-AW的圖標，無論你需要編寫自己的自定義CSS或使用字體真棒本身在項目中

<link href="//code.ionicframework.com/nightly/css/ionic.css" rel="stylesheet"> 
 
<script src="//code.ionicframework.com/nightly/js/ionic.bundle.js"></script> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css"> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<a class="button icon-right ion-chevron-right button-calm">Learn More</a> 
 
<br> 
 

 
<a class="button icon-left ion-chevron-left button-clear button-dark">Back</a> 
 
<br> 
 

 

 
<i class="fa fa-camera-retro fa-lg"></i> fa-lg 
 
<i class="fa fa-camera-retro fa-2x"></i> fa-2x 
 
<i class="fa fa-camera-retro fa-3x"></i> fa-3x 
 
<i class="fa fa-camera-retro fa-4x"></i> fa-4x 
 
<i class="fa fa-camera-retro fa-5x"></i> fa-5x 
 

 
<a class="button button-icon icon ion-settings"></a> 
 
<br> 
 

 
<a class="button button-outline icon-right ion-navicon button-balanced">Reorder</a>

來源

2016-02-17 07:15:41 nabin

如何將按鈕與離子中的圖標對齊

回答

相關問題