Najlepszy samouczek Fundacja Ikona W 2024 r. W tym samouczku możesz dowiedzieć się ikona Składnia,Ikona Przykłady,ikony paska narzędzi,Instrukcja Fundacja Ikona referencyjny,

Fundacja Ikona

Fundacja zapewnia 283 ikon, można określić rozmiar jej styl za pomocą CSS.

Ikony mogą być stosowane do tekstu, przycisków, pasków narzędzi, nawigacji, form, i tak dalej.

Poniżej przedstawiono przykłady ikon założenia:

przycisk Odśwież:

ikona detekcji:

Ikona domu:


ikona Składnia

Tworzenie ikony składnia jest następująca:

<i class="fi-name"></i>

Wymień nazwy ikony część nazwy.

Aby skorzystać z ikony musimy sekcji <head>, aby dodać plik ikona stylu:

<link rel="stylesheet" href="http://static.w3write.com/assets/foundation-icons/foundation-icons.css">

Ikona Przykłady

Poniższe przykłady ilustrują użycie ikony:

Przykłady

<P> ikona h: <i class = "fi-cloud"> </ i> </ p>
<P> ikonę Chmura jako link :
<A Href = "#"> <i class = "fi-cloud"> </ i> </ a>
</ P>
ikona <P> tytułowałem h: < i class = "fi-cloud" style = "font-size: 35px; color: red;"> </ i> </ p>
<P> ikonę Start: <i class = "fi-home"> </ i> </ p>
<P> ikonę Start na przycisk :
<Button type = "button" klasy "Przycisk" =>
<Class I = "fi-home "> </ i> Strona główna
</ Button>
</ P>
<P> Ikona domu na zielonym przyciskiem:
<Button type = "button" class = "sukces przycisk">
<Class I = "fi-home "> </ i> Strona główna
</ Button>
</ P>
<P> Ikona domu na dużym , jasnym niebieskim przyciskiem link:
<A Href = "#" class = "button informacji large">
<Class I = "fi-home "> </ i> Strona główna
</ A>
</ P>

Spróbuj »

ikony paska narzędzi

Możemy użyć .icon-bar klasę aby utworzyć określoną liczbę ikonek:

Przykłady

<Div class = "icon bar pięć-up">
<A Href = "#" class = "item">
<I class = "fi-home "> </ i>
</ A>
<A Href = "#" class = "item">
<Class I = "fi-zakładka "> </ i>
</ A>
<A Href = "#" class = "item">
<Class I = "fi-info "> </ i>
</ A>
<A Href = "#" class = "item">
<I class = "fi-mail "> </ i>
</ A>
<A Href = "#" class = "item">
<Class I = "fi-like "> </ i>
</ A>
</ Div>

Spróbuj »

Ikona Opis Zastosowanie <label> elementów:

Przykłady

<Div class = "icon bar pięć-up">
<A Href = "#" class = "item">
<I class = "fi-home "> </ i>
<Label> Start </ label>
</ A>
<A Href = "#" class = "item">
<I class = "fi-akcja "> </ i>
<Label> Podziel się </ label>
</ A>
<A Href = "#" class = "item">
<Class I = "fi-info "> </ i>
<Label> Informacje </ label>
</ A>
<A Href = "#" class = "item">
<I class = "fi-mail "> </ i>
<Label> Poczta </ label>
</ A>
<A Href = "#" class = "item">
<Class I = "fi-powiększające -glass"> </ i>
<Label> Szukaj </ label>
</ A>
</ Div>
Spróbuj »

.disabled klasy pozwala stać się nie klikać ikony stanu:

Przykłady

<A Href = "#" class = "item disabled">
<I class = "fi-akcja "> </ i>
</ A>

<A Href = "#" class = "item disabled">
<I class = "fi-mail "> </ i>
</ A>

Spróbuj »

.vertical klasa jest używana do tworzenia pionowy pasek narzędzi:

Przykłady

<Div class = "icon bar pionowe pięć-up">
plpl
</ Div>

Spróbuj »

Instrukcja Fundacja Ikona referencyjny

Więcej informacji na temat zawartości ikonę, można zwrócić się do naszej instrukcji ikony Foundation.

Fundacja Ikona
10/30