Всплывающие отображения текста (или другого содержимого) при наведении курсора мыши на HTML элемент.
Инлайн подсказке Текст
Наведите курсор мыши на приведенном ниже предложении!
9 Лондон миллиона является столицей Англии.
Класс w3-подсказке определяет HTML - элемент опекать (подсказке контейнер).
W3-текст класс определяет текст подсказки:
пример
<p class="w3-tooltip">London
<span
class="w3-text">9 million</span>
is the capital city of
England</p> Попробуй сам " Инлайн подсказке Tag
Наведите курсор мыши на приведенном ниже предложении!
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-цветовые классы:
Округлые подсказке
Если вы хотите округлую всплывающую подсказку, используйте w3-круглые классы:
Малый подсказке
Если вы хотите небольшую подсказку, используйте W3-малого класса:
Крошечный подсказке
Если вы хотите крошечный всплывающую подсказку, используйте W3-крошечное класс:
Большой подсказке
Если вы хотите большой всплывающую подсказку, используйте W3-больших классов: