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

W3.CSS التنبيهات


عرض التنبيهات

×

خطر!

الأحمر غالبا ما يشير إلى وجود عمل خطير أو سلبي محتمل.

×

تحذير!

الأصفر والبرتقالي وغالبا ما يشير إلى التحذير التي قد تحتاج إلى عناية.

×

نجاح!

الأخضر غالبا ما يشير إلى عمل ناجح أو إيجابيا.

×

معلومات!

الأزرق غالبا ما يشير إلى تغيير بالمعلومات محايد أو العمل.

مربع التنبيه هو مجرد حاوية W3 مع اللون:

مثال

<div class="w3-container w3-red">
  <h3>Danger!</h3>
  <p>Red often indicates a dangerous or potentially negative action.</p>
</div> 
انها محاولة لنفسك »

الألوان W3.CSS

وغالبا ما يتم عرض التنبيهات مع لون قوي، ولكن أي لون يمكن أن تستخدم:

خطر!

الأحمر غالبا ما يشير إلى وجود عمل خطير أو سلبي محتمل.

تحذير!

الأصفر غالبا ما يشير إلى التحذير التي قد تحتاج إلى عناية.

نجاح!

الأخضر غالبا ما يشير الى ان شيئا ناجحا أو إيجابيا.


خطر!

تحذير!

نجاح!


تنبيهات الإغلاق

لإغلاق هذه الحاويات، انقر على X في الزاوية اليمنى العليا:

×

خطر!

الأحمر غالبا ما يشير إلى وجود عمل خطير أو سلبي محتمل.

×

تحذير!

الأصفر غالبا ما يشير إلى التحذير التي قد تحتاج إلى عناية.

×

نجاح!

الأخضر غالبا ما يشير إلى عمل ناجح أو إيجابيا.

إغلاق تنبيه يمكن أن يتم ذلك باستخدام حدث عند _ النقر على-closebtn W3:

مثال

<span onclick="this.parentElement.style.display='none'" class="w3-closebtn">&times;</span>
انها محاولة لنفسك »

تنبيهات مدورة

استخدام الفئات W3-الجولة إذا كنت تريد تدوير زوايا:

W3-الجولة

W3-جولة كبيرة

W3-جولة-xxlarge

مثال

<div class="w3-container w3-green w3-round">
انها محاولة لنفسك »

تنبيه بمثابة بطاقة

W3-بطاقة-8

مثال

<div class="w3-container w3-red w3-card-8">
انها محاولة لنفسك »