Introducción.

El desarrollo de páginas web ha ido evolucionando de gran manera en los últimos

años, volviendo complejo el desarrollo de estas, pero, debido a ello se han creado
múltiples opciones que son sencillas de utilizar, haciendo más fácil y eficiente el
desarrollo de una página web.

La automatización de algunos procesos es lo que se busca hoy en día, es por ello

que se crearon los frameworks; pero ¿qué es un framework?, se define fácilmente
como el conjunto de herramientas y funciones específicas que son utilizadas para
facilitar el desarrollo de un determinado tema, hoy en día se han vuelto tan
importantes que son imprescindibles para un desarrollador, debido a que permiten
una mejor organización y control en el código elaborado.

Bootstrap es un framework para desarrollar sitios web con responsive, es decir,

para que se adapte a cualquier tipo de tamaño de los dispositivos, es muy útil y
sencillo de utilizar, esto hace que sea eficiente el desarrollo de la página web, más
fácil y rápido. Bootstrap hace uso de muchos elementos importantes de CSS,
HTML y JavaScript, por lo que se considera muy completo al momento hacer uso
de el.

Bootstrap ha evolucionado de gran manera ya que es muy útil e importante, en su

evolución ha tomado en cuenta un mejor soporte haciéndolo más flexible al
desarrollo web. Bootstrap es compatible con la mayoría de navegadores del
mercado, Bootstrap 4 es la renovación más reciente de este frimework y toma en
cuenta muchas más características ,esto y más son las ventajas que tiene el
framework y por eso hoy en día es de las principales opciones más populares y
eficientes para desarrollar una página web.
 Tooltip
¿Qué es un Tooltip?
En el campo de la informática, un Tooltip o globo1n 1 (también llamada descripción
emergente o texto alternativo) es una herramienta de ayuda visual, que funciona al
situar el cursor sobre algún elemento gráfico, mostrando una ayuda adicional para
informar al usuario de la finalidad del elemento sobre el que se encuentra.

¿Por qué es importante?

Los globos son una variación de los globos de ayuda y es un complemento muy
usado e importante en programación y diseño, dado que proporcionan información
adicional sin necesidad de que el usuario la solicite de forma activa.

<div class="tooltip top">Posa el ratón encima de mi

<span class="tiptext">Texto del tooltip</span>
</div>

Código CSS común.

El siguiente CSS sería común para todas las posiciones del tooltip.
.tooltip {
position: relative;
display: inline-block;
border-bottom: 1px dotted black;
}
.tooltip .tiptext {
visibility: hidden;
width: 120px;
background-color: black;
color: #fff;
text-align: center;
border-radius: 3px;
pandingo: 6px 0;
position: absolute;
z-index: 1;
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}
.tooltip .tiptext::after {
content: "";
position: absolute;
border-width: 5px;
border-style: solid;
}
.tooltip:hover .tiptext {
visibility: visible;
}
Ahora debes agregar los CSS para las posiciones.
CSS para Tooltip arriba.
.tooltip.top .tiptext{
margin-left: -60px;
bottom: 150%;
left: 50%;
}
.tooltip.top .tiptext::after{
margin-left: -5px;
top: 100%;
left: 50%;
border-color: #2E2E2E transparent;
}

CSS para Tooltip abajo

.tooltip.bottom .tiptext{
margin-left: -60px;
top: 150%;
left: 50%;
}
.tooltip.bottom .tiptext::after{
margin-left: -5px;
bottom: 100%;
left: 50%;
border-color: transparent #2E2E2E transparent;
}

CSS para Tooltip izquierda

.tooltip.left .tiptext{
top: -5px;
right: 110%;
}
.tooltip.left .tiptext::after{
margin-top: -5px;
top: 50%;
left: 100%;
border-color: transparent #2E2E2E;
}

CSS para Tooltip derecha

.tooltip.right .tiptext{
top: -5px;
left: 110%;
}
.tooltip.right .tiptext::after{
margin-top: -5px;
 top: 50%;
right: 100%;
border-color: transparent #2E2E2E transparent;
}

Categoría.

Texto

¿Para qué se usará el elemento en la página web?

Es uno de los elementos principales e importantes ya que genera información

necesaria para que la persona que la ve se sienta más cómodo y seguro al dar clic
o al realizar las acciones que el desea, es importante que lo empleemos para que
tenga una mejor estética y contenga la información necesaria, lo usaremos en
botones básicos.
Tab
https://neoattack.com/neowiki/framework/

https://devcode.la/blog/que-es-bootstrap/Alexander Guevara Benites

https://raiolanetworks.es/blog/que-es-bootstrap/Mi nombre es Alvaro Fontela,

soy consultor Wordpress y blogger activo desde hace años. Co-Fundador de Raiola
Networks, escribiendo sobre Wordpress en este blog día tras día.

https://es.wikipedia.org/wiki/Información_sobre_herramientas

tooltip