Font Awesome Icon

Font Awesome என்பது CSS மற்றும் LESS அடிப்படையாக கொண்டு fonts மற்றும் icons பெற்றிருக்கும் ஒரு toolkit. Twitter Bootstrap-ல் பயன்படுத்துவதற்காக Dave Gandy என்பவரால் உருவாக்கப்பட்டு பயன்படுத்தப்பட்டு வந்தது. பின்னர் BootstrapCDN-ல் இணைக்கப்பட்டது.

இதில் உள்ள ஒவொரு icon-க்கும் ஒரு html code உள்ளது. இரண்டில் எதை வேண்டுமானாலும் பயன்படுத்திகொள்ளலாம். html code-ஐ பயன்படுத்தினால் cdn link தேவையில்லை. ஆனால் font awesome icons பயன்படுத்தினால் அதற்கான cdn(content delivery network) தேவை படுகிறது.

What is CDN Link?

user-க்கு ஒரு server-ல் இருந்து மற்றொரு server-க்கு web pages-கலையும் Web content-கலையும் வழங்குவது. அதாவது ஒரு web content-ஐ பயன்படுத்த அதற்கான source file நம்முடைய server-ல் இருக்க வேண்டிய அவசியமில்லை. அந்த source file எங்கு உள்ளதோ அந்த link-ஐ மட்டும் பயன்படுத்தினாலே அதை நாம் நமுடைய server-ல் பயன்படுத்தி கொள்ள முடியும்.

கீழே கொடுக்கப்பட்டுள்ள link-ஐ பயன்படுத்தினால் போதும் font awesome-ல் உள்ள icons-ஐ நம்மால் பயன்படுத்திக்கொள்ள முடியும்.

Example

Try this code 

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css">

How to use?

மேலே கொடுக்க பட்டுள்ள link-ஐ copy செய்து <head></head> -ல் paste செய்துகொள்ளுங்கள். பிறகு கீழே காட்டி உள்ள வாறு பயன்படுத்துங்கள்

Example for Font Awesome v5

Example

Try this code 

<i class="fab fa-facebook"></i>
<i class="fab fa-twitter"></i>

<i class="fas fa-check-square"></i>
<i class="far fa-check-square"></i>

Output:

Note: fab என்பது Font Awesome brand-ஐ குறிக்கும். fas என்பது Font Awesome standard mode-ஐ குறிக்கும். far என்பது Font Awesome regular mode-ஐ குறிக்கும்.

Font Awesome v4

கீழே கொடுக்கப்பட்டுள்ள link-ஐ பயன்படுத்தி v4-ஆனது run ஆகிறது.

Example

Try this code 

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

Example

Try this code 

<i class="fa fa-facebook"></i>
<i class="fa fa-twitter"></i>
<i class="fa fa-check-square"></i>
<i class="fa fa-heart"></i>

Output:

Comments