Jestem początkującym w tworzeniu stron internetowych i niedawno zacząłem pracować z Twitter Bootstrap, wiem, że używa on Glyphiconów, których już umiem używać. Ale natknąłem się również na Font Awesome, który mówi, że jest zbudowany dla Bootstrap.
Jakie są różnice między nimi? Mam na myśli, czy jedno jest alternatywą dla drugiego? A może powinieneś ich używać w różnych miejscach?
Odpowiedzi:
W Bootstrap 2.xx Glify były w formacie graficznym, dlatego nie można łatwo zwiększyć rozmiaru, zmienić koloru, koloru tła itp. Jednak font-awesome zapewnia skalowalne ikony wektorowe, które można natychmiast dostosować - rozmiar, kolor, cień i wszystko, co można zrobić za pomocą mocy CSS.
Font-awesome to naprawdę alternatywa dla Glyphyicons, która jest aktualizowana od czasu do czasu o nowe ikony. Fat i Mdo planują zintegrować Font-awesome w bootstrap w wersji 3 jako zamiennik dla Glyphyicons.
Moja sugestia jest taka, abyś używał bootstrapu z font-awesome. Najpierw dołącz css bootstrap, a następnie css Font-awesome, aby Glyphyicony zostały zastąpione przez font-awesome.
AKTUALIZACJA
W wersji bootstrap 3.xx glify stają się formatem czcionki, który będzie ładnie renderował się nawet w rozmiarze czcionki 12px. Jeśli używasz najnowszej wersji fontawesome, tj. 4.01, możesz używać obu glifów z fontawesome.
Font Awesome: - Ponad 150 dodatkowych ikon - Idealny piksel przy domyślnej czcionce bootstrap (14px) - Ikony nie mają tego samego rozmiaru i wymagają niestandardowego CSS dla każdego wyrównania - Posiada listę punktowaną, obrót (można dodać za pomocą css3), zestaw ikon i animacja przędzarki (można dodać ręcznie) Glify: - Mniej ikon - Idealne piksele przy większym rozmiarze czcionki (16 pikseli) - Ikony tego samego rozmiaru
patrz: http://tagliala.github.io/vectoriconsroundup/
Font awesome to zbiór ikon wektorowych, które są uzyskiwane przy użyciu określonej czcionki i niektórych plików CSS w celu stworzenia „magii”. Glyphicons wykorzystuje technikę sprite-css.
Możesz używać ich obu, po prostu dodaj plik css po pliku Bootstrap.
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
<link rel="stylesheet" type="text/css" href="css/font-awesome.min.css"/>
Jeśli nie chcesz mieć glifów, ale tylko ten niesamowity font, przejdź tutaj i dostosuj pobieranie Bootstrap, aby uzyskać je bez glifów.