រំលងទៅខ្លឹមសារមេ

រូបភាពទៅ Base64 ឥតគិតថ្លៃ

បំប្លែងរូបភាពទៅ Base64 data URI សម្រាប់ប្រើបញ្ចូលក្នុង CSS, HTML, ឬ Markdown។ ចម្លង snippet ដែលបានរៀបចំ។ Encode ក្នុងកម្មវិធីរុករករបស់អ្នក; មិនដែលផ្ទុកឡើង។

ធ្វើការក្រៅបណ្តាញនៅពេលបានផ្ទុករួច

ទម្លាក់ឯកសារនៅទីនេះ ឬចុចដើម្បីរកមើល

PNG, JPG, WebP, GIF, SVG, AVIF, ICO, HEIC, HEIF · ដំណើរការលើឧបករណ៍របស់អ្នក

ឬចុច Ctrl+V ដើម្បីបិទភ្ជាប់ពីក្ដារតម្បៀតខ្ទាស់

រុករកឯកសារ

ព័ត៌មាន៖ អ្នកក៏អាចបិទរូបភាពពីក្តារតម្បាញរបស់អ្នក (Ctrl+V) ។

ឯកសាររបស់អ្នកមិនដែលចេញពីឧបករណ៍របស់អ្នកទេ។ ការដំណើរការទាំងអស់កើតឡើងក្នុងស្រុកនៅក្នុងកម្មវិធីរុករករបស់អ្នក។

បំប្លែងរូបភាពទៅ Base64 data URI ដែលអ្នកអាចបិទភ្ជាប់ដោយផ្ទាល់ទៅ CSS, HTML, ឬ Markdown — មិនត្រូវការឯកសារដាច់ដោយឡែក។ Encode នៅក្នុងកម្មវិធីរុករករបស់អ្នក; មិនបានផ្ទុក upload។

ការប្រើប្រាស់ទូទៅ

  • សាក់ឯកសារក្នុង CSSសាក់រូបីដ ឬផ្ទាំងក្រោយដែលលម្អិតក្នុងឯកសារលក្ខណៈ។
  • សាក់ឯកសារក្នុង HTMLសាក់រូបីដ ឬរូបីដ​ដែលលម្អិតក្នុង HTML ដែលលម្អិត។
  • បម្លែង SVG ឬរូបីដ ទៅ Base64បម្លែងរូបីដតូច​ដែលលម្អិតសម្រាប់សាក់។
  • សាក់ឯកសារក្នុង Markdownសាក់ឯកសារតូច​ក្នុង Markdown ឯកសារដែលលម្អិត។
  • ទទួលលក្ខណៈលម្អិត ឯកសារ URIបង្កើតលម្អិត: URI ដែលលម្អិតក្នុងលម្អិត។

វាដំណើរការដោយរបៀបណា

URI ទិន្នន័យ បង្កប់រូបភាពទាក់ទងលម្អិតក្នុងលក្ខណៈលម្អិត ដូច្នេះវាផ្ទុកដោយមិនរើងសម្រាប់ឯកសារផ្សេង — ស្បែកសម្រាប់រូបតូច ឬ HTML ដែលរួមបញ្ចូល។ វិធានៈនេះលេខកូដលម្អិតក្នុងកម្មវិធីរុករក។

  1. 1
    អ្នកដម្បូលរូបភាព
    វាត្រូវបានលិខិតលម្អិតដោយ FileReader API — មិនដែលផ្ទុក។
  2. 2
    វាត្រូវបានលេខកូដ Base64
    បៃរូបភាពក្លាយជាទិន្នន័យ: URI (data:image/...;base64,…) ក្នុងលក្ខណៈលម្អិតក្នុងកម្មវិធីរុករក។
  3. 3
    អ្នកជ្រើសរើសឯកលក្ខណៈលម្អិត
    ចម្លងទិន្នន័យ URI ដែលបង្កើត ឬ CSS ដែលរៀបរាប់ (ផ្ទៃក្រោយរូបភាព) HTML (<img>) ឬ Markdown។
  4. 4
    ដាក់វាលម្អិតក្នុងលក្ខណៈលម្អិត
    រូបភាពឥឡូវនេះលាើយ infolding ដោយ CSS/HTML — គ្មានឯកសារលម្អិតដើម្បីផ្ទុក។

រូបភាពត្រូវបានលេខកូដលម្អិតទាំងស្រុងលើឧបករណ៍របស់អ្នក។ សម្គាល់ថា Base64 គឺ ~33% ធំជាងលក្ខណៈលម្អិតដើម ដូច្នេះទិន្នន័យ URIs គឺល្អបំផុតសម្រាប់រូបភាពតូច។

ឧបករណ៍ពាក់ព័ន្ធ

សំណួរដែលសួរជាញឹកញាប់