Redimensionar imagem no wiki do GitHub usando Markdown

255

Estou escrevendo uma página wiki no GitHub e usando o Markdown.

Meu problema é que estou colocando uma imagem grande (esta imagem está em seu próprio repositório) e preciso redimensioná-la.

Eu tentei soluções diferentes, mas elas não funcionam:

![image](http://url.to/image.png "Title" {width=40px height=400px})

![image](http://url.to/image.png = 250x250)

![image](http://url.to/image.png = 250x)

[[http://url.to/image.png = 250x]]

Existe uma maneira de obtê-lo?

É preferível sem HTML.

html github markdown wiki fhuertas
fonte
1
Possível duplicata de Como alterar o tamanho da imagem Markdown?
Francisco Puga 28/06

Respostas:

373

Atualizada:

Código (externo / interno):

![test](https://github.com/favicon.ico)

Código (interno / externo para dimensionamento ):

<img src="https://github.com/favicon.ico" width="48">

Exemplo:

teste

Resposta antiga:

Isso deve funcionar:

[[ http://url.to/image.png | altura = 100 px]]

Fonte: https://guides.github.com/features/mastering-markdown/

alciregi
fonte
Obrigado. <img src="..." width="48">trabalha no READMEs para imagens carregadas no GitHub.
Sam Dutton
@ SamDutton: Parece funcionar bem também para imagens hospedadas em outros lugares.
Jonik 21/09/2015
1
Teste hoje. O Github não reconhece a sintaxe de [] (.. = 400) ou [] (... = 400px); portanto, se eu precisar redimensionar a imagem, tenho que usar a sintaxe <img />.
Spikeyang
1
A resposta riscada funciona se a imagem for adicionada ao próprio wiki.
Eduardo
2
O que @Eduardo disse ... A 'Resposta antiga' que você riscou é o que eu tenho procurado na Internet - ainda funciona muito bem para caminhos relativos (ativos dentro do wiki). Além disso, eu tive que adicionar uma ou duas imagens dentro de uma tabela. O caractere de pipe estava me deixando triste por causa da formatação típica da tabela na margem de lucro. Escapando o tubo dentro de uma célula da tabela ainda é válido: [[ http://url.to/img.png \| height=48px]].
11118 DanMad
57

No GitHub, você pode usar HTML diretamente em vez de Markdown:

<a href="url"><img src="http://url.to/image.png" align="left" height="48" width="48" ></a>

Isso deve fazer isso.

Fritzip
fonte
10
Obrigado pela solução, é possível sem código html?
fhuertas
1
Só quero observar que você pode excluir o arquivo widthpara que ele possa dimensionar a largura com base na altura automaticamente.
Eu sou um dragão sapo
2
Não apenas no Github; Acredito HTML em linha é permitida dentro Markdown em geral ...
Nicolas Miari
os br e hr não ajudam.
precisa saber é o seguinte
2

Quase 5 anos depois, apenas a formatação HTML direta funciona para imagens no GitHub e outras opções de descontos ainda impedem o carregamento de imagens ao especificar alguns tamanhos personalizados, mesmo com as dimensões incorretas. Prefiro especificar a largura desejada e obter a altura calculada automaticamente, por exemplo,

<img src="https://github.com/your_image.png" alt="Your image title" width="250"/>
Expandir snippet

Kate Orlova
fonte
2

Eu usei os métodos descritos acima. Agora estou usando o método que é uma maneira semelhante, mas mais simples para mim.

  1. Primeiro, crie o arquivo README.md adicionado ao seu projeto.
  2. Em seguida, faça o upload de capturas de tela ou quaisquer imagens de descrição necessárias para o diretório principal do projeto.
  3. Após fazer o upload da imagem, os ativos usam html para se referir diretamente a esses ativos, sem usar o link abaixo

Como isso:

<img src="icon.jpg" width="324" height="324">

<p align="center">
  <img src="screen1.png" width="256" height="455">
  <img src="screen2.png" width="256" height="455">
  <img src="screen3.png" width="256" height="455">
</p>

No exemplo acima, usei o parágrafo para alinhar as imagens lado a lado. Se você usar uma imagem única, use o código abaixo

<img src="icon.jpg" width="324" height="324">

Tenha um bom dia!

Seymur Mammadli
fonte
0

As páginas do GitHub agora usam o kramdown como seu mecanismo de remarcação para que você possa usar a seguinte sintaxe:

Here is an inline ![smiley](smiley.png){:height="36px" width="36px"}.

http://kramdown.gettalong.org/syntax.html#images

Ainda não testei no wiki do GitHub.

nicobo
fonte
1
@nicobo eu tentei parece que não funciona para imagem externa?
user310291
Isso funciona em páginas GitHib usando Jekyll, FYI (Sei que isso não é precisamente a questão PO)
DavidJ
0

Isso aborda a questão diferente, como obter imagens na marcação gist (em oposição ao github) em primeiro lugar?

Em dezembro de 2015, parece que apenas links para arquivos funcionam github.comou não cloud.githubusercontent.com. Etapas que funcionaram para mim em essência:

  1. Faça uma essência, digamos Mygist.md(e, opcionalmente, mais arquivos)
  2. Vá para a caixa "Escrever comentário" no final
  3. Clique em "Anexar arquivos ... selecionando-os"; selecione seu arquivo de imagem local
  4. O GitHub reproduz uma cadeia longa e longa onde coloca a imagem, por exemplo! [Khan-lasso-squared] ( https://cloud.githubusercontent.com/assets/1280390/12011119/596fdca4-acc2-11e5-84d0-4878164e04bb.png )
  5. Cole e cole manualmente no seu Mygist.md.

Mas: as pessoas do GitHub podem mudar esse comportamento amanhã, sem documentá-lo.

denis
fonte
7
Onde está o aspecto de redimensionamento?
koppor