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

W3.CSS تلميحات


تلميحات عرض النص (أو أي محتوى آخر) عندما كنت تحوم فوق عنصر HTML.


النص المضمن تلميح الأدوات

تحوم فوق الجملة أدناه!

9 ملايين لندن هي عاصمة إنجلترا.

وتعرف الطبقة W3-تلميح أداة عنصر HTML لتحوم فوق (حاوية تلميح الأدوات).

وتعرف الطبقة W3-نص نص تلميح الأدوات:

مثال

<p class="w3-tooltip">London
<span class="w3-text">9 million</span>
is the capital city of England</p>
انها محاولة لنفسك »

المضمنة تلميح الأدوات الكلمات الدلالية

تحوم فوق الجملة أدناه!

9 ملايين لندن هي عاصمة إنجلترا.

وتعرف الطبقة W3-تلميح أداة عنصر HTML لتحوم فوق (حاوية تلميح الأدوات).

وتعرف الطبقة W3-نص نص تلميح الأدوات:

مثال

<p class="w3-tooltip">London
<span class="w3-text w3-tag">9 million</span>
is the capital city of England</p>
انها محاولة لنفسك »

تلميح الأدوات واسع

تحوم فوق هذه الصورة لمعرفة التأثير:

سيارة

سيارة هي للسيارات التي تعمل بالطاقة الذاتية عجلات تستخدم للنقل. معظم التعريفات لهذا المصطلح تحدد أن السيارات وعادة ما يكون أربع عجلات. (ويكيبيديا)

وتعرف الطبقة W3-تلميح أداة عنصر HTML لتحوم فوق (حاوية تلميح الأدوات).

وتعرف الطبقة W3-نص نص تلميح الأدوات:

مثال (النص المعروض في الصورة)

<div class="w3-tooltip">

<p class="w3-text">A car is a wheeled, self-powered motor vehicle used for transportation. Most definitions of the term specify that cars typically have four wheels.(Wikipedia)</p>

<img src="img_car.jpg" alt="Car" style="width:100%">

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

مثال (النص بعد الصورة)

<div class="w3-tooltip">

<img src="img_car.jpg" alt="Car" style="width:100%">

<p class="w3-text">A car is a wheeled, self-powered motor vehicle used for transportation. Most definitions of the term specify that cars typically have four wheels.(Wikipedia)</p>

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

تلميح الأدوات المطلق

إذا كنت تريد أن يظهر تلميح الأدوات في موضع مطلق، ضع النص تلميح الأدوات (W3-النص):

مثال

<p class="w3-tooltip">London is the capital city of England.
<span style="position:absolute;left:0;bottom:18px"
class="w3-text w3-tag">9million</span></p>
انها محاولة لنفسك »

اللون تلميح الأدوات

إذا كنت ترغب في تلميح الأدوات الملونة، استخدام الفئات W3-اللون:

مثال

<span class="w3-text w3-tag w3-red ">9 million</span>
انها محاولة لنفسك »

تلميح الأدوات مدورة

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

مثال

<span class="w3-text w3-tag w3-round ">9 million</span>
انها محاولة لنفسك »

تلميح الأدوات الصغيرة

إذا كنت ترغب في تلميح الأدوات الصغيرة، واستخدام فئة-W3 صغير:

مثال

<span class="w3-text w3-tag w3-small ">9 million</span>
انها محاولة لنفسك »

تلميح الأدوات الصغيرة

إذا كنت ترغب في تلميح صغير، استخدم فئة W3 الصغير:

مثال

<span class="w3-text w3-tag w3-tiny ">9 million</span>
انها محاولة لنفسك »

تلميح الأدوات واسع

إذا كنت ترغب في تلميح كبير، استخدام الطبقات-W3 كبير:

مثال

<span class="w3-text w3-tag w3-xlarge ">9 million</span>
انها محاولة لنفسك »