كيفية إضافة أيقونات
لإدراج رمز، إضافة اسم الفئة الرمز إلى أي عنصر HTML المضمنة.
و <i>
و <span>
وتستخدم على نطاق واسع العناصر لإضافة الرموز.
جميع الرموز في المكتبات رمز أدناه، هي أيقونات ناقلات تحجيم التي يمكن تخصيصها مع CSS (size, color, shadow, etc.)
أيقونات ممتاز الخط
لاستخدام الخط الرموز ممتاز، إضافة السطر التالي داخل <head>
قسم من صفحة HTML:
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
ملاحظة: لا يلزم تحميل أو التثبيت!
مثال
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet"
href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
</head>
<body>
<i class="fa fa-cloud"></i>
<i
class="fa fa-heart"></i>
<i class="fa fa-car"></i>
<i class="fa fa-file"></i>
<i class="fa fa-bars"></i>
</body>
</html>
انها محاولة لنفسك » التمهيد الأيقونات
استخدام glyphicons التمهيد، إضافة السطر التالي داخل <head>
قسم من صفحة HTML:
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
ملاحظة: لا يلزم تحميل أو التثبيت!
مثال
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
</head>
<body>
<i class="glyphicon glyphicon-cloud"></i>
<i class="glyphicon
glyphicon-remove"></i>
<i class="glyphicon glyphicon-user"></i>
<i
class="glyphicon glyphicon-envelope"></i>
<i class="glyphicon glyphicon-thumbs-up"></i>
</body>
</html>
انها محاولة لنفسك » أيقونات جوجل
استخدام الرموز جوجل، إضافة السطر التالي داخل <head>
قسم من صفحة HTML:
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
ملاحظة: لا يلزم تحميل أو التثبيت!
مثال
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
</head>
<body>
<i class="material-icons">cloud</i>
<i
class="material-icons">favorite</i>
<i
class="material-icons">attachment</i>
<i
class="material-icons">computer</i>
<i
class="material-icons">traffic</i>
</body>
</html>
انها محاولة لنفسك » للحصول على قائمة كاملة لجميع الرموز ممتاز الخط، زيارة الخط ممتاز رمز المرجعية .
للحصول على قائمة كاملة لجميع Glyphicons التمهيد، قم بزيارة إشارة التمهيد Glyphicon .
للحصول على قائمة كاملة لجميع الرموز جوجل، قم بزيارة رمز المرجعية جوجل .