Ubah ukuran gambar di wiki GitHub menggunakan Markdown

255

Saya sedang menulis halaman wiki di GitHub, dan saya menggunakan Markdown.

Masalah saya adalah saya meletakkan gambar besar (gambar ini di repositori sendiri) dan saya perlu mengubah ukurannya.

Saya sudah mencoba berbagai solusi, tetapi tidak berhasil:

![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]]

Apakah ada cara untuk mendapatkannya?

Lebih disukai tanpa HTML.

html github markdown wiki fhuertas
sumber
1
Kemungkinan duplikat dari Bagaimana cara mengubah ukuran gambar Penurunan harga?
Francisco Puga

Jawaban:

373

Diperbarui:

Kode (eksternal / internal):

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

Kode (internal / eksternal untuk ukuran ):

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

Contoh:

uji

Jawaban lama:

Ini seharusnya bekerja:

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

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

alciregi
sumber
Terima kasih. <img src="..." width="48">bekerja di README untuk gambar yang diunggah ke GitHub.
Sam Dutton
@SamDutton: Tampaknya berfungsi dengan baik juga untuk gambar yang dihosting di tempat lain.
Jonik
1
Uji hari ini. Github tidak akan mengenali sintaks [] (.. = 400) atau [] (... = 400px), jadi jika saya perlu mengubah ukuran gambar, saya harus menggunakan sintaks <img />.
spikeyang
1
Jawaban mencoret berfungsi jika gambar ditambahkan ke wiki itu sendiri.
Eduardo
2
Apa yang dikatakan @Eduardo ... 'Jawaban Lama' yang telah Anda hilangkan adalah apa yang telah saya cari di internet — masih bagus untuk jalur relatif (aset di dalam wiki). Selain itu, saya harus menambahkan satu atau dua gambar di dalam tabel. Karakter pipa memberi saya kesedihan karena pemformatan tabel khas dalam penurunan harga. Melarikan diri pipa di dalam sel tabel masih berlaku: [[ http://url.to/img.png \| height=48px]].
DanMad
57

Di GitHub, Anda dapat menggunakan HTML secara langsung alih-alih penurunan harga:

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

Ini harus membuatnya.

Fritzip
sumber
10
Terima kasih atas solusinya, mungkinkah tanpa kode html?
fhuertas
1
Hanya ingin dicatat bahwa Anda dapat mengecualikan widthsehingga dapat menskalakan lebar berdasarkan ketinggian secara otomatis.
Saya naga katak
2
Bukan hanya di Github; Saya percaya inline HTML diperbolehkan dalam penurunan harga secara umum ...
Nicolas Miari
br dan jam tidak membantu.
JoshYates1980
2

Hampir 5 tahun setelah hanya format HTML langsung berfungsi untuk gambar di GitHub dan opsi penurunan harga lainnya masih mencegah gambar dari memuat ketika menentukan beberapa ukuran khusus bahkan dengan dimensi yang salah. Saya lebih suka menentukan lebar yang diinginkan dan mendapatkan tinggi dihitung secara otomatis, misalnya,

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

Kate Orlova
sumber
2

Saya telah menggunakan metode yang dijelaskan di atas. Sekarang saya menggunakan metode yang mirip tapi lebih mudah bagi saya.

  1. Pertama buat, tambahkan file README.md ke proyek Anda.
  2. Kemudian unggah tangkapan layar atau gambar deskripsi apa pun yang diperlukan ke direktori utama proyek Anda.
  3. Setelah mengunggah Aset gambar, gunakan html untuk merujuk aset ini secara langsung tanpa menggunakan tautan seperti di bawah ini

Seperti ini:

<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>

Pada contoh di atas saya telah menggunakan paragraf untuk menyelaraskan gambar berdampingan. Jika Anda akan menggunakan gambar tunggal cukup gunakan kode seperti di bawah ini

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

Semoga harimu menyenangkan!

Seymur Mammadli
sumber
0

GitHub Pages sekarang menggunakan kramdown sebagai mesin penurunan harga sehingga Anda dapat menggunakan sintaks berikut:

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

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

Saya belum mengujinya di GitHub wiki.

nicobo
sumber
1
@nicobo yang saya coba sepertinya tidak berfungsi untuk gambar eksternal?
user310291
Ini berfungsi di halaman GitHib menggunakan Jekyll, FYI (Saya sadar ini bukan pertanyaan OP)
DavidJ
0

Ini membahas pertanyaan yang berbeda, bagaimana cara mendapatkan gambar di markdown (sebagai lawan github) di tempat pertama?

Pada Desember 2015, tampaknya hanya tautan ke file di github.comatau cloud.githubusercontent.comatau sejenisnya yang berfungsi. Langkah-langkah yang berhasil bagi saya di inti:

  1. Buat intisari, katakan Mygist.md(dan file lainnya opsional)
  2. Pergi ke kotak "Tulis Komentar" di bagian akhir
  3. Klik "Lampirkan file ... dengan memilihnya"; pilih file gambar lokal Anda
  4. GitHub menggemakan string panjang yang panjang di mana ia menempatkan gambar, misalnya! [Khan-lasso-squared] ( https://cloud.githubusercontent.com/assets/1280390/12011119/596fdca4-acc2-11e5-84d0-4878164e04bb.png )
  5. Potong-rekatkan itu dengan tangan ke tangan Anda Mygist.md.

Tetapi: Orang-orang GitHub dapat mengubah perilaku ini besok, tanpa mendokumentasikannya.

denis
sumber
7
Di mana aspek resize?
koppor