Najlepszy samouczek Przycisk Fundacja W 2024 r. W tym samouczku możesz dowiedzieć się
przycisk Styl,przycisk Rozmiar,przycisk zaokrąglone,rozszerzenie przycisk,przycisk Wyłącz,
Przycisk Fundacja
przycisk Styl
Fundacja oferuje sześć stylów przycisków. .button
klasy tworzy niebieski przycisk wraz z otuliną. Różne kolory dla klasy przycisków: .secondary
, .success
, .info
, .warning
lub .alert
:
Przykłady
<Button type = class "przycisk" = "button"> Domyślnie przycisk </>
<Button type = class "przycisk" = "button wtórne"> Secondary </ button>
<Button type = "button" class = "sukces przycisk"> Sukces </ button>
<Button type = "button" class = "info button"> Informacje </ button>
<Button type = "button" class = "Ostrzeżenie przycisk"> Uwaga </ button>
<Button type = "button" class = "alert przycisk"> Uwaga </ button>
Spróbuj » Klasa przycisk może być używany w <a>
, <button>
lub <input>
elementów:
Przykłady
<A Href = "#" class = "button info" role = "button"> Link przyciskowy </ a>
<Button type = "button" class = "info button"> Przycisk </ button>
<Input type = "button" class = "info button" value = "Przycisk Input">
<Input type = "submit" class = "info button" value = "Zatwierdź przyciskiem">
Spróbuj » | Dlaczego href tag # będzie? Jeżeli nie chcemy, aby przejść i kliknij na link, aby uzyskać stronę "404", możemy ustawić href znacznika #. |
---|
przycisk Rozmiar
Możemy użyć .large
, .small
lub .tiny
klasę, aby ustawić rozmiar przycisku:
Przykłady
<Button type = class "przycisk" = "button duże"> duży </ button>
<Button type = class "przycisk" = "button"> Domyślnie przycisk </>
<Button type = class "przycisk" = "button małe"> mały </ button>
<Button type = class "przycisk" = "button malutki"> Tiny </ button>
Spróbuj »
przycisk zaokrąglone
Można użyć .radius
i .round
klasę ustawić okrągły przycisk:
Przykłady
<Button type = class "przycisk" = "button"> Przycisk Domyślne </ button>
<Button type = "button" class = "Promień przycisk"> Promień Przycisk </ button>
<Button type = "button" class = "okrągły przycisk"> Okrągły Przycisk </ button>
Spróbuj »
rozszerzenie przycisk
Można użyć .expand
klasę ustawić przycisk do 100% szerokopasmowych:
Przykłady
<Button type = class "przycisk" = "button"> Przycisk Domyślne </ button>
<Button type = class "przycisk" = "button rozwinąć"> Expanded Przycisk </ button>
Spróbuj »
przycisk Wyłącz
Można użyć .disabled
klasę kliknij przycisk Ustawienia nie jest dostępny:
Przykłady
<Button type = class "przycisk" = "button"> Przycisk Domyślne </ button>
<Button type = class "przycisk" = "button wyłączony"> Przycisk niepełnosprawnych </ button>
Spróbuj »