Base64
Image Data URL
⚠️ Large image may freez the browser
แปลงรูปภาพ JPG เป็นสตริง Base64
แปลงรูปภาพ JPG เป็นสตริง Base64 สำหรับการรวมเข้ากับโครงการเว็บอย่างราบรื่น อัปโหลดไฟล์ JPG ของคุณและเลือกรูปแบบผลลัพธ์ เครื่องมือสร้างสตริง Base64 ซึ่งคุณสามารถคัดลอกและใช้โดยตรงในโค้ดของคุณ สตริง Base64 ช่วยให้แทรกรูปภาพแบบออนไลน์โดยไม่ต้องมีตัวพึ่งพาภายนอก
Image → Base64 / Data URL
Click or Drag & Drop an Image
แปลงไฟล์ JPG เป็น Base64 ได้ง่าย
1
อัปโหลดรูปภาพของคุณ
อัปโหลดรูปภาพ JPG ของคุณโดยคลิกหรือลากและวาง
2
เลือก Base64 หรือ DataURL
เลือกแท็บ 'Base64' หรือ 'DataURL' เพื่อเลือกรูปแบบที่ต้องการ
3
แสดงข้อมูลสตริง
สตริงที่เข้ารหัส Base64 หรือ DataURL จะปรากฏในพื้นที่ข้อความใต้แท็บ
4
คัดลอกโค้ดที่สร้างขึ้น
คลิกปุ่ม 'คัดลอก' เพื่อคัดลอกโค้ดที่สร้างขึ้น
ใส่ภาพ JPG ลงในเว็บไซต์ของคุณโดยตรง
การรวมรูปภาพลงใน HTML โดยตรงโดยไม่มีไฟล์ภายนอก จำเป็นต้องแปลง JPG เป็นสตริง Base64 หรือ DataURL วิธีนี้จะช่วยลดความจำเป็นในการโฮสต์รูปภาพแยกต่างหาก ทำให้โครงสร้างเว็บไซต์ของคุณเรียบง่ายขึ้น การฝังรูปภาพลงในโค้ดสามารถปรับปรุงเวลาในการโหลดได้โดยลดการพึ่งพาภายนอก
คัดลอกข้อมูลภาพที่เข้ารหัสอย่างรวดเร็ว
แปลงรูปภาพ JPG เป็นสตริง Base64 หรือ DataURL เพื่อฝังข้อมูลรูปภาพโดยตรงในโค้ด HTML หรือ JavaScript ปุ่ม 'Copy' ช่วยให้รวมระบบโดยไม่ต้องจัดการไฟล์ภายนอก ซึ่งทำให้กระบวนการทำงานของนักพัฒนาที่ทำงานกับสินทรัพย์ที่ฝังอยู่มีประสิทธิภาพมากขึ้น
คำถามที่พบบ่อย
อะไรคือสตริง Base64/DataURL และทำไมฉันถึงต้องใช้มัน
สตริง Base64/DataURL คือวิธีหนึ่งในการแทนที่รูปภาพด้วยข้อความ สิ่งนี้ช่วยให้คุณสามารถฝังรูปภาพลงใน HTML หรือ CSS โดยตรง โดยไม่ต้องพึ่งพาไฟล์รูปภาพภายนอก ซึ่งมีประโยชน์สำหรับรูปภาพขนาดเล็กและสามารถทำให้โครงสร้างของโครงการของคุณง่ายขึ้น
เครื่องมือนี้รองรับไฟล์ประเภทใดบ้าง
เครื่องมือนี้รองรับภาพ JPG ในปัจจุบัน
ฉันใช้เครื่องมือนี้อย่างไร
อัปโหลดรูปภาพ JPG ของคุณ เลือกรูปแบบ 'Base64' หรือ 'DataURL' แล้วคลิกปุ่ม 'Copy' เพื่อรับรหัสที่สร้างขึ้น จากนั้นคุณสามารถวางรหัสนี้ลงในโปรเจกต์เว็บของคุณได้โดยตรง
มีข้อจำกัดในการใช้เครื่องมือนี้ไหม
รูปภาพขนาดใหญ่ไม่แนะนำ เนื่องจากอาจทำให้คอมพิวเตอร์ช้าลงในระหว่างกระบวนการแปลง รูปสตริง Base64/DataURL ที่ได้ก็อาจมีขนาดใหญ่ ซึ่งอาจส่งผลกระทบต่อเวลาในการโหลดหน้าเว็บ
ฉันสามารถใช้สตริง Base64/DataURL ได้ที่ไหน
คุณสามารถใช้สตริงนี้ภายในแท็ก <img> ของ HTML หรือคุณสมบัติ background-image ของ CSS หรือในบริบทอื่นใดที่ซึ่ง URL ข้อมูลได้รับการยอมรับ