Agregue texto flotante sin JavaScript como si estuviéramos sobre el nombre de un usuario

Agregue Texto Flotante Sin Javascript Como Si Estuvieramos Sobre El Nombre De Un Usuario



En muchas páginas web, a menudo vemos un texto que aparece en un determinado elemento cuando pasamos el cursor sobre él y desaparece cuando movemos el cursor a otro lugar de la pantalla. Ese texto se llama texto flotante. En JavaScript, es fácil agregar el texto flotante en un elemento. Pero, también es posible agregar un texto flotante en un documento HTML usando el botón “
elemento ” o el “ ” elemento con el atributo de título.

Este artículo demostrará dos métodos útiles para agregar un texto flotante en HTML sin usar JavaScript:

Método 1: agregar texto flotante a través del elemento 'div'

Se puede agregar un texto flotante simplemente usando el botón '

elemento ” con el “ título ” atributo en la apertura “ ”. El desarrollador debe agregar el texto flotante en el atributo 'título' dentro del '
” etiqueta de apertura y el elemento HTML se agrega entre la apertura y el cierre “
” etiquetas. El texto dentro del “
El elemento contenedor puede ser de cualquier tipo. Por ejemplo, un “

' título, '

” elemento de párrafo, o un texto sin formato simple.





Ejemplo

Escribamos un ejemplo simple para agregar el '

” para agregar el texto flotante sobre un elemento HTML:



< división título = 'Este es el texto flotante' > ¡Pasa el cursor sobre mí! < / división >

Según el código anterior:



  • A '
    Se ha añadido el elemento ” con el “ título ” atributo en la apertura “
    ' etiqueta.
  • El ' título El atributo ” contiene el texto que se supone que debe mostrarse mientras el usuario pasa el cursor del mouse sobre el texto.
  • Entre la apertura y el cierre”
    ” etiquetas es el texto que se mostrará en la interfaz sobre la que se mostrará el texto flotante.

El ejemplo agregado anteriormente mostrará el siguiente resultado:



Método 2: agregue texto flotante a través del elemento 'span'

También se puede agregar un texto flotante usando el botón ' ” elemento en HTML. Todo lo que requiere es agregar el texto flotante en el atributo de título y el elemento HTML real para el cual se agrega el texto flotante entre la apertura y el cierre ' ” etiquetas.



Ejemplo

Agreguemos un ejemplo simple para insertar el ' ” en el documento HTML con el fin de agregar el texto flotante sobre un elemento HTML:

< durar título = 'Este es el texto flotante' >¡Pon el cursor sobre mí!< / durar >

En el ejemplo anterior:

  • A ' Se ha añadido el elemento ” con el “ título ” atributo dentro de la apertura “ ' etiqueta.
  • El ' título El atributo ” contiene el texto que se supone que se muestra cuando el usuario se desplaza sobre él.
  • Entre la apertura y el cierre” ” etiquetas es el texto que se mostrará al usuario que se desplaza sobre el que se mostrará el texto flotante.

Producción

Esto resume los posibles métodos para agregar un texto flotante sin usar JavaScript.

Conclusión

Se puede agregar fácilmente un texto flotante en HTML sin requerir el uso de funciones de JavaScript. El desarrollador necesita usar el '

elemento ” o el “ ” que crea el elemento HTML y luego agrega el atributo de título que define el texto flotante. Esta publicación es una buena guía sobre el método para agregar el texto flotante sin necesidad de JavaScript.

Otro

Categoría

Entradas Populares

Cómo crear una nueva cuenta de usuario de Jupyter Hub

Cómo eliminar carpetas de perfil de usuario antiguas automáticamente en Windows Vista y versiones posteriores - Winhelponline

¿Existe algún método para eliminar un repositorio local en Git?

Cómo usar la función Vsprintf() en PHP

Cómo usar el operador '|=' en Java

Tienda Microsoft con tecnología de IA de Windows 11

Cómo instalar HOOBS en Raspberry Pi

¿Cómo combinar los cambios del repositorio local usando el comando 'git merge' en Git?

¿Cómo instalar ChatGPT localmente?

¿Cómo funciona el método path.relative() en Node.js?

¿Cómo recuperar documentos de Word no guardados en Windows 10?

¿Qué hace EBS en AWS?

ImageMagick: reducción del tamaño de los archivos

¿Cuál es el propósito de AWS Device Farm?

Las mejores aplicaciones de ChatGPT en 2023

Cómo cambiar el brillo de la linterna en iPhone

Multiprocesamiento de Python For-Loop

Uso de la instrucción goto en Arduino

Cómo eliminar el motor de búsqueda en Chrome

Cómo usar múltiples clases en un elemento en CSS