github README.md imagen central

Esto es del soporte de Github:

Hey Waldyr,

Markdown no le permite ajustar la alineación directamente (ver documentos aquí: http://daringfireball.net/projects/markdown/syntax#img ), pero solo puedes usar una etiqueta 'img' HTML sin procesar y hacer la alineación con css en línea.

Salud,

Así que ¡Es posible alinear imágenes! Solo tienes que usar css en línea para resolver el problema. Puedes tomar un ejemplo de mi github repo. En la parte inferior de README.md hay una imagen alineada centrada. Para simplificar, puedes hacer lo siguiente:

<p align="center">
  <img />
</p>

¡Aunque, como dijo nulltoken, estaría bordeando la filosofía de Markdown!

Alternativamente, si tienes el control del css, podrías ser inteligente con los parámetros de url y css.

Markdown:

![A cute kitten](http://placekitten.com/200/300?style=centerme)

Y CSS:

img[src$="centerme"] {
  display:block;
  margin: 0 auto;
}

Usted podría crear una variedad de opciones de estilo de esta manera y todavía mantener el descuento limpio de código adicional. Por supuesto, no tiene control sobre lo que sucede si alguien más usa el markdown en otro lugar, pero eso es un problema de estilo general con todos los documentos markdown que uno comparte.

Funciona para mí en github

<p align="center"> 
<img src="...">
</p>

También puede cambiar el tamaño de la imagen a la anchura deseada y altura. Por ejemplo:

<p align="center">
  <img src="https://anyserver.com/image.png" width="750px" height="300px"/></p>

Para añadir un subtítulo centrado a la imagen, solo una línea más:

<p align="center">This is a centered caption for the image<p align="center">

Afortunadamente, esto funciona tanto para README.md y las páginas Wiki de GitHub.

Para extender un poco la respuesta para soportar imágenes locales, simplemente reemplace FILE_PATH_PLACEHOLDER a su ruta de imagen y compruébelo.

<p align="center">
  <img src="FILE_PATH_PLACEHOLDER">
</p>

Para alineación izquierda

 <img align="left" width="600" height="200" src="https://www.python.org/python-.png">

Para alineación derecha

<img align="right" width="600" height="200" src="https://www.python.org/python-.png">

Y para la alineación central

<p align="center">
  <img width="600" height="200" src="https://www.python.org/python-.png">
</p>

Mi manera de resolver el problema con el posicionamiento de la imagen fue usar los atributos HTML:

![Image](Image.svg){ width="800" height="600" style="display: block; margin: 0 auto" }

La imagen fue redimensionada y centrada correctamente, al menos en mi renderizador local VS markdown.

Luego, he empujado cambios a repo y desafortunadamente me di cuenta de que no funciona para GitHub README.md file . Sin embargo, voy a dejar esta respuesta, ya que podría ayudar a alguien más.

Así que finalmente, he terminado usando la vieja y buena etiqueta HTML en su lugar:

<img src="Image.svg" alt="Image" width="800" height="600" style="display: block; margin: 0 auto" />

Pero ¿adivina qué? ¡Algún método JS reemplazó mi atributo style! Incluso he intentado class atributo y con el mismo resultado!

Luego he encontrado la siguiente página de síntesis donde se usó aún más HTML de la vieja escuela:

<p align="center">
    <img src="Image.svg" alt="Image" width="800" height="600" />
</p>

Este está funcionando bien, sin embargo, me gustaría dejarlo sin más comentarios...

Podemos usar esto. Por favor, cambie la ubicación src de ur img desde la carpeta git y agregue texto alternativo si img no está cargado

 <p align="center"> 
    <img src="ur img url here" alt="alternate text">
 </p>

Esto es bastante simple en realidad.

-> This is centered Text <-

Así que teniendo esto en cuenta, puede aplicar esto a la sintaxis img.

->![alt text](/link/to/img)<-