أحدث البرامج التعليمية وتطوير الشبكة
 

W3.CSS الرموز

❮ السابق التالي الفصل ❯

المكتبات رمز

مع W3.CSS يمكنك استخدام أي مكتبة رمز مثل:

  • أيقونات ممتاز الخط
  • جوجل رموز المواد
  • التمهيد الأيقونات

استخدام الرموز

لاستخدام الرمز، فقط قم بإضافة اسم رمز لفئة من أتش تي أم أل <ط> العنصر.

للسيطرة على حجم الرمز، تغيير الخاصية حجم الخط من الرمز، أو استخدام الفئات حجم w3-:

  • W3-صغيرة
  • W3-صغيرة
  • W3-كبير
  • W3-xxlarge
  • W3-xxxlarge

أيقونات ممتاز الخط


اتحاد كرة القدم اتحاد كرة القدم المنزل

اتحاد كرة القدم اتحاد كرة القدم القضبان

اتحاد كرة القدم ترك كرة القدم-السهم

اتحاد كرة القدم اتحاد كرة القدم السهم الأيمن

اتحاد كرة القدم اتحاد كرة القدم في البحث عن

اتحاد كرة القدم اتحاد كرة القدم عن قرب

اتحاد كرة القدم اتحاد كرة القدم-تحديث

اتحاد كرة القدم اتحاد كرة القدم القمامة

اتحاد كرة القدم اتحاد كرة القدم للذكور

اتحاد كرة القدم اتحاد كرة القدم السيارات

اتحاد كرة القدم اتحاد كرة القدم شاحنة

اتحاد كرة القدم اتحاد كرة القدم، الطائرة

مثال

<!DOCTYPE html>
<html>
<title>W3.CSS</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://www.w3ii.com/lib/w3.css">
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
<body>

<i class="fa fa-cloud"></i>
<i class="fa fa-cloud w3-large"></i>
<i class="fa fa-cloud w3-xlarge"></i>
<i class="fa fa-cloud w3-xxlarge"></i>
<i class="fa fa-cloud w3-xxxlarge"></i>
<i class="fa fa-cloud w3-text-teal" style="font-size:64px"></i>

</body>
</html>
انها محاولة لنفسك »

ملاحظة للحصول على قائمة كاملة من الرموز: زيارة موقعنا على إشارة رمز

جوجل المواد الأيقونات التصميم

الصفحة الرئيسية
الصفحة الرئيسية
قائمة طعام
قائمة طعام
arrow_back
arrow_back
arrow_forward
arrow_forward
بحث
بحث
أغلق
أغلق
اعادة تنشيط
اعادة تنشيط
حذف
حذف
شخص
شخص
directions_car
directions_car
local_shipping
local_shipping
local_airport
local_airport

مثال

<!DOCTYPE html>
<html>
<title>W3.CSS</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://www.w3ii.com/lib/w3.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<body>

<i class="material-icons">cloud</i>
<i class="material-icons w3-large">cloud</i>
<i class="material-icons w3-xlarge">cloud</i>
<i class="material-icons w3-xxlarge">cloud</i>
<i class="material-icons w3-xxxlarge">cloud</i>
<i class="material-icons w3-text-teal" style="font-size:64px">cloud</i>

</body>
</html>
انها محاولة لنفسك »

التمهيد الأيقونات


الصفحة الرئيسية

القائمة هامبرغر

arrow_back

arrow_forward


بحث

إزالة

اعادة تنشيط

قمامة


مستخدم

ملف

طباعة

طائرة

مثال

<!DOCTYPE html>
<html>
<title>W3.CSS</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://www.w3ii.com/lib/w3.css">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<body>

<i class="glyphicon glyphicon-cloud"></i>
<i class="glyphicon glyphicon-cloud w3-large"></i>
<i class="glyphicon glyphicon-cloud w3-xlarge"></i>
<i class="glyphicon glyphicon-cloud w3-xxlarge"></i>
<i class="glyphicon glyphicon-cloud w3-xxxlarge"></i>
<i class="glyphicon glyphicon-cloud w3-text-teal" style="font-size:64px"></i>

</body>
</html>
انها محاولة لنفسك »

❮ السابق التالي الفصل ❯