【django】class='btn'btnボタンスタイル

Button
目次

基本使用

ボタン状態

ボタンサイズ

ブロックレベル表示

ボタンIcon

きほんしよう
標準スタイル
ボタンスタイルを適用する要素に.am-btnを追加し、対応する色を設定します.

.am-btn-default-デフォルト、グレーボタン

.am-btn-primary-青ボタン

.am-btn-secondary-水色ボタン

.am-btn-success-緑のボタン

.am-btn-warning-オレンジボタン

.am-btn-danger-赤いボタン

.am-btn-link

 Copy
標準スタイルメインボタンサブカラーボタン緑ボタンオレンジボタン赤ボタンリンクボタンスタイルのリンクを適用

    
    
    
    
    
    
リンク
ボタンスタイルのリンクを  

フィレットボタン
デフォルトスタイルに.am-radius classを追加します.
 Copy
標準スタイルメインボタンサブカラーボタン緑ボタンオレンジボタン赤ボタン

だえんけいボタン
デフォルトスタイルに.am-round classを追加します.
 Copy
標準スタイルメインボタンサブカラーボタン緑ボタンオレンジボタン赤ボタン

ボタンのステータス
アクティブ状態
ボタンに.am-active classを追加します.
 Copy
アクティブ状態アクティブ状態リンクボタンアクティブ状態リンクボタンアクティブ状態

    
    




リンクボタンのアクティブ 
リンクボタンのアクティブ 

無効な状態
ボタンにdisabledプロパティを設定するか、.am-disabled classを追加します.
 Copy
無効状態無効状態リンクボタン無効状態リンクボタン無効状態リンクボタン無効状態

    
    

リンクボタン    
リンクボタン    

IE 9では、disabledのプロパティが設定されているbutton要素の文字をグレーにレンダリングし、白いシャドウを付けるので、CSSではこのデフォルトスタイルを制御できません.
ボタンサイズ

.am-btn-xl

.am-btn-lg

.am-btn-default

.am-btn-sm

.am-btn-xs

 Copy
ボタン-xlボタン-lgボタンデフォルトサイズボタン-smボタン-xsボタン-xlボタン-lgボタンデフォルトサイズボタン-smボタン-xs

   - xl
   - lg
      
   - sm
   - xs

   - xl
   - lg
      
   - sm
   - xs

ブロックレベル表示.am-btn-block classを追加します.
 Copy
ブロックレベル表示のボタンブロックレベル表示のボタン

ボタンIcon
Iconを使用する前に、Iconコンポーネントを導入する必要があります.
 Copy
決済ロードでのダウンロードスライスの設定

  
    


チェックアウト


  
     



      
  

Issueリスト

リンクボタンのアクセス後のスタイルを白

に統一することを推奨する.