https://s5.postimg.org/y6o4evv1z/computer-graphics-markdown-steemit-theghost1980.jpg
[![](https://s5.postimg.org/3kxtijfg7/mouse_right_black_mini.png)](https://s5.postimg.org/y6o4evv1z/computer-graphics-markdown-steemit-theghost1980.jpg)

Saludos _Steemianos y Steemianas_ quiero darles a todos un gran saludo. Espero que todos la estén pasando muy bien. Si estás llegando a la plataforma el día de hoy recibe mi cordial bienvenida, y te invito, a mirar con detalle este artículo para que vayas "corriendo" a escribir tu artículo de presentación. Si ya tienes tiempo en Steemit y aún sigues "peleando" con el lenguaje _HTML_ al momento de centrar imágenes y alinear textos, estas prácticas pueden ayudarte mucho. Ante cualquier duda de como colocar el editor de steemit en modo _Markdown_ lee la imagen a la derecha.

##### Imágenes en Markdown. Las múltiples maneras. ![](https://s5.postimg.org/ke9pj94af/markdown_logo.png) A continuación iré detallando, de manera muy práctica, las diferentes alineaciones que puedes realizar para el tratamiento de las imágenes en tu artículos cuando utilices _Markdown_. - Imagen centrada a tamaño original, sin fuente: ` link`. En el caso del ejemplo estoy utilizando como "link", el siguiente [enlace](http://cdn3-www.dogtime.com/assets/uploads/gallery/30-impossibly-cute-puppies/impossibly-cute-puppy-21.jpg). El resultado sería la imagen centrada, en su tamaño original: http://cdn3-www.dogtime.com/assets/uploads/gallery/30-impossibly-cute-puppies/impossibly-cute-puppy-21.jpg

- Centrada / Tamaño original / Con enlace a fuente: ` link
[Fuente](link)`. Como puedes notar, _link_ es el enlace directo a la imagen y _Fuente_ es el texto que le colocas que se convertirá en "cliqueable" de color azul. Utilizando el mismo enlace, anteriormente mencionado, tenemos: http://cdn3-www.dogtime.com/assets/uploads/gallery/30-impossibly-cute-puppies/impossibly-cute-puppy-21.jpg
[Fuente](http://cdn3-www.dogtime.com/assets/uploads/gallery/30-impossibly-cute-puppies/impossibly-cute-puppy-21.jpg)

http://cdn3-www.dogtime.com/assets/uploads/gallery/30-impossibly-cute-puppies/impossibly-cute-puppy-21.jpg

- Alineada a la derecha tamaño original (_se reducirá automáticamente_): ```

link

``` Puedes ver la imagen a un lado derecho. Cuando veas espacios en blanco, debes respetarlos para no tener errores cuando utilices este código en tus artículos. >Venga @theghost1980, una imagen un poco mas "seisi" y atrevida. Esos cachorros me producen un ataque ternuro-agresivo-post-traumático...

http://cdn3-www.dogtime.com/assets/uploads/gallery/30-impossibly-cute-puppies/impossibly-cute-puppy-21.jpg
[Fuente | Source](http://cdn3-www.dogtime.com/assets/uploads/gallery/30-impossibly-cute-puppies/impossibly-cute-puppy-21.jpg)

- Alineada a la derecha / Con enlace de fuente: ```

link
[Fuente | Source](link)

``` Puedes notar la misma imagen "traumática" del canino pero con su enlace de fuente. Nota: Dicho enlace de fuente puede ser anidado, es decir, en vez de Fuente, colocas una imagen pequeña tipo [icono](https://s5.postimg.org/3kxtijfg7/mouse_right_black_mini.png). Os pido que utilicen otras imágenes y no "mis iconos". Revisen una fuente de [iconos gratuitos aquí](https://icons8.com).

http://cdn3-www.dogtime.com/assets/uploads/gallery/30-impossibly-cute-puppies/impossibly-cute-puppy-21.jpg
[![](https://s5.postimg.org/3kxtijfg7/mouse_right_black_mini.png)](http://cdn3-www.dogtime.com/assets/uploads/gallery/30-impossibly-cute-puppies/impossibly-cute-puppy-21.jpg)

- Alineada a la derecha / Con imagen de icono como enlace de fuente: ```

link
[![](link-icono)](link)

``` Puedes notar la misma imagen con su fuente, pero esta vez, el enlace de fuente es un icono "cliqueable".

http://photos-ak.sparkpeople.com/nw/1/5/l1562257435.jpg
[Fuente | Source](http://photos-ak.sparkpeople.com/nw/1/5/l1562257435.jpg)

Alineación a la izquierda / Con enlace de fuente: ```

link
[Fuente](link)

``` Puedes notar que os he cambiado la imagen, a una mucho más sugestiva y "seisi".

http://photos-ak.sparkpeople.com/nw/1/5/l1562257435.jpg
[Fuente | Source](http://photos-ak.sparkpeople.com/nw/1/5/l1562257435.jpg)

http://photos-ak.sparkpeople.com/nw/1/5/l1562257435.jpg
[Fuente | Source](http://photos-ak.sparkpeople.com/nw/1/5/l1562257435.jpg) - Varias imágenes con alineación a la derecha y fuente de imagen, separadas por un `

`: ```

link
[Fuente | Source](link)

link
[Fuente | Source](link) ``` Puedes utilizar diversas cantidades de imágenes y hacer galerías de fotos o gifs animados. Os recomiendo utilizar imágenes en buena resolución para óptimos resultados.

https://www.generadormemes.com/media/created/tog8npzd8kwd1wcih1yi06944fmnnape9xcr1j7ifzn7qujkf23f0d0g39is4fq.jpg

https://www.generadormemes.com/media/created/tog8npzd8kwd1wcih1yi06944fmnnape9xcr1j7ifzn7qujkf23f0d0g39is4fq.jpg

- Ahora bien, ¿qué sucede si jugamos un poco con las divisiones o `

`?. Para finalizar les dejaré dos imágenes dentro de un `

`. Dichas imágenes están "renderizadas" dentro de otros dos `

`. Uno alineado a la derecha y otro a la izquierda. Dicha [fuente de imagen esta aquí](https://www.generadormemes.com/media/created/tog8npzd8kwd1wcih1yi06944fmnnape9xcr1j7ifzn7qujkf23f0d0g39is4fq.jpg). ```

link

link

``` Espero que este artículo te sea de mucha ayuda. En las próximas entregas continuaré profundizando en otras areas dentro del lenguaje Markdown. _STEEM ON, muchachON_.

![img](https://s5.postimg.org/5y4bgqewn/theghost1980_base_png.png)
Saturno Mangieri - *Asesor de Tecnologías Blockchain*
[![](https://saturnomangieri.com/wp-content/uploads/2017/09/myface.png)](https://www.facebook.com/satmangieri/) . [![](https://saturnomangieri.com/wp-content/uploads/2017/09/mytwitter.png)](https://twitter.com/saturnomangieri) . [![](https://s5.postimg.org/5b5er7i0n/saturnomangieri_WEbsite.png)](https://saturnomangieri.com) ###### _iconos tomados de icons8.com_