Icoane CSS. Cum se adaugă icoane. Font Awesome Icons.

Icoane CSS (CSS Icons)

Cum se adaugă icoane


Cel mai simplu mod de a adăuga o pictogramă pe pagina dvs. HTML, este cu o bibliotecă de pictograme, cum ar fi Font Awesome.
Adăugați numele clasei de pictograme specificate la orice element HTML inline (cum ar fi <i> sau <span>).
Toate pictogramele din bibliotecile cu pictograme de mai jos, sunt vectori scalabili care pot fi personalizați cu CSS (dimensiune, culoare, umbră etc.)

Font Awesome Icons

Pentru a utiliza pictogramele Font Awesome, accesați fontawesome.com, conectați-vă și obțineți un cod pe care să îl adăugați în secțiunea <head> a paginii dvs. HTML:

<script src = "https://kit.fontawesome.com/yourcode.js"> </script>

Exemplu:
<!DOCTYPE html>
<html>
<head>
<script src="https://kit.fontawesome.com/a076d05399.js"></script>
</head>
<body>

<i class="fas fa-cloud"></i>
<i class="fas fa-heart"></i>
<i class="fas fa-car"></i>
<i class="fas fa-file"></i>
<i class="fas fa-bars"></i>

</body>
</html>
Rezultat:

\r\n\r\nExemplu:\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nRezultat:\r\n\r\n","educationalLevel":"High School","learningResourceType":"theory","typicalAgeRange":"14-19","inLanguage":"ro","isAccessibleForFree":true,"datePublished":"2019-11-20T10:52:00+00:00","dateModified":"2026-05-11T21:46:26+00:00","author":{"@type":"EducationalOrganization","name":"Lecții Virtuale","url":"https://staging.lectii-virtuale.ro"},"publisher":{"@type":"EducationalOrganization","name":"Lecții Virtuale","url":"https://staging.lectii-virtuale.ro"},"educationalAlignment":{"@type":"AlignmentObject","alignmentType":"educationalSubject","targetName":"Tehnologii Web"}}