Font Awesome nasıl kullanılır?

Kullandığınız kodu atabilir misiniz? Veya direkt şunuda deneyebilirsiniz o kod yerine, eğer bu şekilde bir şey kullanmıyorsanız.

HTML:
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.3.0/css/all.min.css" integrity="sha512-SzlrxWUlpfuzQ+pcUCosxcglQRNAq/DZjVsC0lE40xsADsfeQoEypE+enwcOiGjk/bSuGGKHEyjSoQ1zVisanQ==" crossorigin="anonymous" referrerpolicy="no-referrer" />
 
Hocam yaptım hallettim de evet bende fark ettim bazıları ücretsiz değil ama kullanırken bozuk çıkıyor ya da çıkmıyor kare şeklinde bir şey geliyor ekrana.
Ikonun tipinden dolayı olabilir ona dikkat ediyor musunuz? Bazı ikonlar solid, bazıları regular, bazılarıysa brand isimleriyle çıkıyor karşımıza. Bunlara göre ayrı class vermelisin, örneğin brands yani markalar için fa-brands fa-facebook yazman gerekirken solid ikonlar için fa-solid fa-envelope şeklinde kullanmalısın, regular için de fa-regular fa-envelope gibi.
 
Siteden kod aldım olmadı. CDN kullandım o yarı oldu, yarı olmadı. Nasıl yapabilirim?
Hocam yapacağınız şey şu. Fontawesome sitesine gidip kit oluşturup ordaki scripti kodunuzun head kısmına ekleyeceksiniz. Daha sonra orda icons kısmına gelip istediğiniz iconun üzerine tıklayıp css classını alcaksınız veya div olarak otomatik kopyalayacaksınız.

Mesela:

HTML:
<html>
    <head>
        <script src="https://kit.fontawesome.com/3d4e5897c0.js" crossorigin="anonymous"></script>
    </head>
    <body>
        <!--Örnek Div-->
        <div class="fa-solid fa-house"></div>
        <!--Buton-->
        <button class="fa-solid fa-house"></button>
    </body>
</html>

Ücretsiz iconlar buradan seçilebilir:
Eğer kit uğraşmakla istemiyorsanız benimkini kullanın:
<script src="https://kit.fontawesome.com/3d4e5897c0.js" crossorigin="anonymous">
 

Technopat Haberler

Yeni konular

Yeni mesajlar

Geri
Yukarı