Cómo hacer Flujo de texto alrededor de una forma irregular en CSS

CSS o Cascading Style Sheets, es una poderosa herramienta para el diseño de Web que permite mucho más la personalización de los sitios web que antes era posible. Sin embargo, algunas verdades básicas acerca de diseño web se mantienen sin cambios, y entre ellos es el hecho de que cualquier imagen, sin importar la forma que parece ser, es tratado por el código fuente como un rectángulo.Esto es problemático si se desea que el texto u otros elementos en línea a fluir alrededor de los contornos de la imagen. Afortunadamente, con una solución rápida con el software de edición gráfica, es posible hacer que parezca como si el texto fluye alrededor de una irregularforma de la imagen.

 

ALREDEDOR IRREGULAR

 

Lo que necesita

Software de edición gráfica

Procesador de textos

 

Abra el archivo de imagen que contiene la irregular forma que desea que el texto fluya alrededor en su programa de edición de gráficos preferido.

 

Seleccionar los 15 mejores píxeles de la imagen con un cuadro de selección rectangular lo suficientemente ancha como para abarcar los bordes de la imagen en esa posición vertical.

 

Cortar esta selección, péguelo en un nuevo documento y guardarlo, con un nombre de archivo que indica que es la primera parte de la imagen global.

 

Repita la selección, corte y ahorro de proceso para el resto de la imagen. Usted debe tener una serie de imágenes, cada una de 15 píxeles de alto y de anchos variables, que se puede apilar juntos para recrear la imagen original, el nombre con el fin de mantener fácilmente en el orden correcto.

 

Subir las imágenes al servidor de su sitio está en.

 

Abra el documento de código fuente del sitio en un procesador de textos.

 

Eliminar la imagen original del código del sitio.

 

Tipo

 

clase img src = "pila" = "" /

 

en el código una vez para cada uno de sus nuevas imágenes, con la dirección de la imagen entre las comillas después de "src." Estas líneas de código deben estar en el mismo lugar de la imagen original apareció en el código.

 

Tipo

 

Tipo style = "text / css" / estilo

 

en el documento en entre la cabeza y / etiquetas de la cabeza, si no está ya presente.

 

Tipo

 

img.stack {float:; margin: 0;}

 

entre las etiquetas de estilo, ya sea con la "izquierda" o "derecha" (sin las comillas) después de los dos puntos después de "flotador", dependiendo de qué lado de la texto que desea que la imagen se encenderá.