เทคนิคการทำ Bullet Arrow จัดทำโดย : Mr.GuruZ พิมพ์
 Un title page

เทคนิคการทำ Bullet Arrow บางคนอาจจะสงสัยว่าการทำลูกศรหน้าข้อความทำอย่างไร ต้องใช้ Photoshop ด้วยหรือเปล่า จริงๆ แล้วเราสามารถใช้ Dreamweaver ทำได้เลยเช่นกัน แต่งานนี้ต้องใช้ CSS เข้ามาช่วยเล็กน้อยนะครับ มาดูขั้นตอนการทำเลยดีกว่าครับ

ขั้นตอนการทำ

1. สร้างเอกสารเว็บเพจขึ้นมา เลือกแถบเครื่องมือ Characters จากนั้นเลือก Insert Other Character เลือกสัญญลักษณ์ "»" ใส่ลงในเว็บ ดังภาพ

2. จากนั้นในหน้าเว็บเพจจะขึ้นตัวอักษร ดังภาพ

3. ทำการสร้าง Css ชื่อว่า Arrow เพื่อนำไปควบคุม Character ให้เป็น Bullet Arrow
* ถ้าใครไม่เข้าใจการสร้าง Css ลองอ่านบทความการสร้าง Css เพิ่มเติมนะครับ

4. จากนั้นนำ Css มาใส่ที่ Character ดังภาพ

5. จากนั้นตบแต่งสีสันให้เข้ากับข้อความและลอง Preview ดูจะได้ดังภาพ

6. ลองนำไปใช้กับเว็บดูนะครับ เผื่อจะได้ไม่ต้องมานั่งปวดหัวกับการสร้าง Bullet Arrow ต่างๆ

 

คุณอาจสนใจ
วิธีการเปลี่ยนแป้นพิมพ์ตัวเลขอาราบิกให้เป็นเลขไทย XP
เว็บไทยดีดี (18,379 - 08 ก.ย. 50)
การใช้คำสั่ง DSum สำหรับหาผลรวมข้อมูลโดยกำหนดเงื่อนไข
นายจืด (26,284 - 03 พ.ค. 51)
การใช้คำสั่ง แบบ if...else
Mr.POP (50,568 - 05 พ.ย. 49)
CDBurnerXP ฟรีแวร์เขียนแผ่นซีดี
เว็บไทยดีดี (17,588 - 22 ก.ย. 50)
เสกไดรฟ์ให้ล่องหน...(Vista)
เว็บไทยดีดี (16,929 - 10 พ.ค. 51)
บันทึกไฟล์ Flash เก็บเอาไว้ง่ายนิดเดียว
สุธีร์ นวกุล (39,504 - 15 ก.ย. 50)
การใช้งาน String Class (ตอนที่ 1)
Mr.POP (52,371 - 05 พ.ย. 49)
การส่งเมล์ด้วยฟังก์ชั่นส่งเมล์ แบบธรรมดา
เฟริสท์ (47,260 - 07 ธ.ค. 50)