Tambah Imej dalam Markdown dan Ubah Suai Saiz Imej

Tambah Imej Dalam Markdown Dan Ubah Suai Saiz Imej



'Markdown' ialah salah satu bahasa Markup yang menyediakan kemudahan berbeza untuk menambah teks, tajuk, perenggan, senarai dan pautan dan juga kami boleh menggunakan pemformatan pada elemen ini dalam Markdown. Kami juga boleh memasukkan imej dalam Markdown dan kemudian mengubah suai saiz imej yang telah kami tambahkan dalam Markdown. Untuk mengubah suai atau menukar saiz imej dalam Markdown, kita perlu menggunakan tag . Kami akan menunjukkan kepada anda, dalam panduan ini, cara menambah imej dalam Markdown serta cara mengubah suai saiz imej dalam Markdown.

Untuk Menambah Imej dalam Markdown:

Sintaks diberikan di bawah.

![alt text ](laluan imej/nama imej dengan sambungan 'Teks yang menunjukkan apabila alih tetikus' )

Untuk Mengubah Saiz Imej dalam Markdown:

Untuk mengubah suai saiz imej dalam Markdown, kami menggunakan teg ' ' HTML. Hanya teg ini membantu dalam mengubah suai saiz imej dalam Markdown dan sintaks teg ' ' ini diberikan di bawah.







< img src = 'nama imej' segala-galanya = “” lebar = 'nilai' ketinggian = 'nilai' >

Kita boleh menukar saiz imej dengan menetapkan nilai lebar dan ketinggian dalam nombor serta dalam peratusan. Kami juga boleh menggunakan atribut gaya dalam teg ' ' ini untuk mengubah suai saiz imej dalam Markdown.



Contoh # 01:

Kami menggunakan Kod Visual Studio untuk melaksanakan kod Markdown. Untuk kod Markdown, kita perlu membuka kedua-dua editor teks dan juga tetingkap pratonton. Dalam editor teks, kita perlu menambah input dan output diperoleh dalam tetingkap pratonton. Dalam editor teks, kami mula-mula menambah imej dalam Markdown dengan meletakkan '!' simbol dan kemudian tambah kurungan segi empat sama di mana kami menambah 'teks Alt'. Sekarang, kami menambah laluan imej.



Kami memasukkan nama imej dengan sambungannya kerana kedua-dua kod dan imej disimpan dalam direktori yang sama. Jadi, kami hanya menambah nama di sini iaitu 'cloud.png'. Kemudian, kami menambah teks iaitu 'Imej Awan' dan ini ialah teks yang ditunjukkan hanya apabila tetikus di atas. Kini, imej itu ditambah dan kita juga boleh melihat imej ini dalam tetingkap pratonton.





Imej awan ditunjukkan di bawah kerana kami telah menambah imej ini dalam kod Markdown yang dipaparkan di atas.



Contoh # 02:

Sekarang, kami mengubah suai saiz imej ini dengan menggunakan teg ' '. Pertama, kita masukkan 'src' di mana nama atau laluan imej ditambah. Selepas ini, kami meletakkan 'alt' dan melaraskan 'Imej Awan'. Kami melaraskan 'lebar' imej kepada '230'. 'Ketinggian' dilaraskan kepada '300'. Kami juga menambah 'tajuk' dalam teg ' ' ini dan nilai 'tajuk' ini ialah 'Tajuk awan'. Kini, saiz imej diubah suai. Anda boleh melihat saiz imej yang diubah suai dalam tetingkap pratonton.

Saiz imej dalam hasil ini diubah suai dan 'lebar' imej ialah '230' dan 'tinggi' ialah '300'. Ini kerana kami telah melaraskan lebar dan ketinggian ini dalam kod Markdown.

Contoh # 03:

Kami juga boleh mengubah suai 'lebar' dan 'tinggi' imej dengan meletakkan nilainya dalam peratusan. Selepas menambah nama atau laluan imej dan melaraskan 'alt' kepada 'Imej Awan', kami telah menetapkan 'lebar' dan 'tinggi' imej kepada '50%'. Kemudian, tambahkan 'tajuk' dan tutup teg ini.

Berikut ialah imej yang saiznya diubah suai dengan menggunakan teg “ ”. Ketinggian imej, serta lebar, ialah '50%'.

Contoh # 04:

Kini, kami menggunakan atribut 'style' dalam teg ' ' ini untuk mengubah suai saiz imej dalam Markdown. Kita mesti menambah nama imej dan kemudian atribut 'alt'. Selepas ini, kami meletakkan atribut 'gaya' dan menambah 'lebar dan tinggi' sebagai nilainya. 'Lebar' yang kami tetapkan adalah dalam piksel iaitu '500px' dan 'tinggi' ialah '400px'. Sekarang, saiz imej akan disesuaikan dengan sewajarnya.

Saiz imej dalam hasil carian ini telah dikemas kini; 'lebar'nya kini '500px' dan 'tinggi'nya ialah '400px'. Ini dapat dilihat hasil daripada kod Markdown yang diberikan di atas di mana kami telah melaraskan lebar dan ketinggian dalam atribut gaya.

Contoh # 05:

Kami menambah imej lain. Tetapi dalam kod Markdown ini, kami tidak menukar saiz imej. Saiz imej ditukar hanya apabila kami telah menggunakan tag ' '. Kami meletakkan '!' dan kemudian tambahkan teks di dalam kurungan segi empat sama iaitu 'Imej Matahari'. Selepas menutup kurungan segi empat sama, kami meletakkan kurungan di mana kami telah memasukkan nama imej 'New_sun.png' dan kemudian menambah teks yang akan ditunjukkan pada tetikus. Saiz asal imej akan ditunjukkan dalam hasil.

Imej matahari ditunjukkan kerana kami telah menambah imej ini dalam kod Markdown. Selain itu, saiz asal imej boleh dilihat kerana kami tidak boleh melaraskan saiz imej tanpa menggunakan teg ' '.

Contoh # 06:

Dengan menggunakan teg ' ', kami kini menukar saiz imej ini. Mula-mula, kami menambah nama atau laluan imej yang saiznya ingin kami ubah suai ke medan 'src'. 'lebar' dan 'tinggi' imej telah ditukar kepada '300'. Saiz imej kini telah berubah. Tetingkap pratonton menunjukkan saiz baharu imej.

Lebar dan ketinggian imej telah diubah suai kepada '300'.

Contoh # 07:

Dengan menetapkan nilai 'lebar' dan 'tinggi' imej dalam peratusan, kami boleh menukar dimensi ini dengan mudah. Kami berdua melaraskan 'lebar' dan 'tinggi' imej kepada '40%' dan kemudian menutup teg ini.

Berikut ialah imej dengan ketinggian 40% dan juga 40% lebarnya. Kami telah menambah lebar dan tinggi ini di dalam teg ' ' selepas menambah nama imej.

Contoh # 08:

Kini, kami menggunakan atribut 'style' dalam teg ' ' untuk menukar saiz imej dalam Markdown. Kami menambah 'lebar dan tinggi' sebagai nilai pada atribut 'gaya' selepas menambah nama imej dan atribut 'alt'. 'Lebar' yang kami tentukan ialah '450px', manakala 'tinggi' juga dilaraskan kepada '450px.' Saiz imej kini akan berubah dengan sewajarnya mengikut nilai lebar dan ketinggian baharu ini.

Kini, hasil kod ini juga ditunjukkan dalam tetingkap pratonton yang dipaparkan di bawah. Kedua-dua lebar dan ketinggian imej ini kini '450px' dalam hasil di bawah ini.

Kesimpulan:

Kami telah meneroka konsep menambah imej secara terperinci dalam panduan ini dan kami juga telah meneroka cara mengubah suai saiz imej dalam Markdown juga. Kami telah menambah imej dalam Markdown dan mengubah suai saiznya dengan bantuan teg ' ' dan telah menunjukkan cara untuk melakukan semua ini dalam Markdown. Kami telah menukar saiz imej dengan meletakkan nilai lebar dan tinggi dalam nombor serta dalam peratusan. Kami juga telah menggunakan atribut gaya dalam teg ' ' untuk mengemas kini atau mengubah suai saiz imej dalam Markdown.