ท่านเคยเห็นปุ่มในลักษณะนี้หรือไม่ บันทึก คิดว่าคงเคยเห็นกันล่ะนะ แล้วท่านสงสัยมั้ยว่า เขาเอารูปภาพไปใส่ในปุ่มได้อย่างไร

สงสัย สงสัย สงสัย หรือ ไม่เคยสงสัยเลย ???

เมื่อก่อนผมใช้บ่อยปุ่มแบบนี้ แต่พอนานเข้าๆ สมองชักลืมว่ามันมีวิธีใส่ภาพเข้าไปในปุ่ม วันนี้ท่องไปในโลกไซเบอร์ เจอปุ่มแบบนี้เข้าอีกครั้ง

ทำให้นึกขึ้นได้ เลยมาเขียนเป็นบทความซะ จะได้เตือนตัวเองด้วย

เท้าความหน่อยนะ แท็กที่ใช้ในการสร้างปุ่มของ html นั้น มีอยู่ 2 แท็ก คือ

1. <input type="submit" name="button" id="button" value="Submit" /> แท็ก input ซึ่งเราใช้กันประจำ

2. <button type="submit" name="button" id="button" >บันทึก</button> แท็ก button ตัวนี้แหละที่สังคมลืม

แท็ก button นี่แหละครับ ที่อนุญาติให้เราใส่รูปภาพเข้าไปในปุ่มได้ ดูตัวอย่าง

<button type="submit" name="button" id="button" ><img src="images/icons/disk.png" width="16" height="16" align="absmiddle" /> บันทึก</button>

แค่นี้แหละครับ ใส่ภาพเข้าไปในระหว่างแท็ก button ได้เลย เวลาแสดงผล ก็จะมีภาพพร้อมข้อความแสดงอยู่ในปุ่ม

ชิลชิล ใช่มั้ยครับ…

บทความน่าสนใจ

1. ตกแต่งฟอร์มล้อกอินสวยๆ ด้วย CSS ง่ายๆแต่ได้สาระ
2. jQuery .each เขาใช้กันยังไง
3. upload image with php การอัปโหลดรูปภาพเก็บในฐานข้อมูล
4. วิธีการตรวจสอบ checkbox ด้วย jQuery
5. เพิ่มแถวเข้าไปในตารางด้วย jQuery