Cómo hacer flotar fácilmente una imagen a la derecha del texto

Cómo hacer flotar fácilmente una imagen a la derecha del texto

Cómo hacer flotar fácilmente una imagen a la derecha del texto

VALORACIÓN DEL ARTÍCULO:
5/5


Si estás interesado en aprender a hacer flotar una imagen a la derecha del texto, te alegrará saber que es una tarea bastante sencilla. Hay muchas situaciones en las que los programadores quieren que una imagen en una página Web aparezca dentro del texto con el texto fluyendo o envuelto alrededor de él. Afortunadamente, manipular imágenes es similar a manipular texto, así que si tienes experiencia con este último, este proceso no debería ser difícil en absoluto.

De hecho, con la propiedad float de CSS, es fácil hacer flotar su imagen a la derecha del texto y hacer que el texto fluya a su alrededor en el lado izquierdo. Utilice este tutorial de cinco minutos para aprender cómo.

Introducción

Para empezar, escriba un párrafo de texto y añada una imagen al principio del párrafo. Esto debe hacerse antes del texto pero después de la etiqueta

):

A continuación, añada un atributo de estilo a la imagen y aplique la propiedad float:

El texto se apisonará contra la imagen, así que agregue algunos márgenes a la imagen para que sea más fácil de leer:

La propiedad margin shorthand aplica márgenes en el orden superior, derecho, inferior e izquierdo (TRBL).

Envolviendo

Y eso es todo. Ahora ves que flotar una imagen a la derecha no es nada difícil. También le puede interesar hacer flotar una imagen a la izquierda y hacerla flotar hacia el centro. Mientras que el primer movimiento es posible, desafortunadamente, usted no puede hacer flotar una imagen al centro, ya que eso requeriría típicamente un diseño de dos columnas.

TAMBIÉN TE INTERESA

Zenfone-11-Ultra

Zenfone 11 Ultra, que siga la fiesta de la IA en los smartphones

Todos los últimos lanzamientos de smartphones están marcados por la inteligencia artificial. Este hecho, que ocupa los titulares de hoy, se está convirtiendo en un estándar y pronto dejará de ser noticia. Pero no estos momentos es la novedad y la transformación hacia la que caminan todas las marcas del mercado. Así lo ha hecho

Enco-Buds2-Pro

Enco Buds2 Pro: unos auriculares buenos, bonitos, baratos e inteligentes

Por menos de 50 euros, los auriculares OPPO Enco Buds2 Pro pueden darnos todo lo que necesitamos para nuestro día a día. ¿Por qué? Porque son una combinación excepcional de calidad de sonido, duración de batería extendida y un diseño moderno y funcional. Además cuentan con funciones inteligentes y dan a los usuarios la libertad

Xiaomi-14-Series

Xiaomi 14 Series se suma a la puja por ser el móvil del año

Xiaomi 14 Series llega al mercado para colarse en la eterna batalla que mantienen los flagships de Apple y Samsung. Al igual que sus rivales, los nuevos móviles de la marca china llegan con la IA bajo el brazo y una gran cantidad de razones para aspirar a ser uno de los móviles del 2024.