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

grabar-un-despido-en-TikTok

La (peligrosa) tendencia de grabar un despido en TikTok

TikTok es una red social en la que cabe absolutamente de todo. Y cuando decimos todo, es todo. Una de las últimas tendencias en auge es grabar un despido en TikTok. Si uno hace una búsqueda de contenido desde hashtags como #layoffs y #techleyoffs, encontrará un gran número de vídeos de personas que son echadas

impacto-a-la-IA-Generativa-en-el-cloud-privado

El impacto de la IA Generativa en el Cloud Privado

En este artículo indagamos sobre un término que está muy de moda en estos días: la IA Generativa. Además de describir qué y cuál es su potencial, lo vamos a relacionar con el Cloud Privado, ya que estos entornos pueden dar un gran paso adelante gracias a la capacidad de procesamiento y generación de datos

recetas-de-postres

Conviértete en todo un chef con las recetas de cocina de Alexa

El famoso asistente de voz de Amazon puede hacer casi de todo lo que le pidas, incluidas las recetas de cocina de Alexa. Tras cinco años de vida en España, algo más en Estados Unidos, los datos que maneja la compañía indican que muchas personas recurren a Alexa como su ayudante en la cocina, ya

videos-TikTok

TikTok vs. Google: la red social planta cara al buscador rey

Las búsquedas en Internet viven su particular Juego de Tronos. Google siempre ha estado sentado en el Trono de Hierro pero cada vez más familias están pujando por destronar al rey. Sin duda, Microsoft se ha postulado como un digno rival con su navegador Edge y la puesta en marcha de la IA en esta