โดย ส่วนใหญ่เเล้วการออกแบบหน้าเว็บไซต์ เราจะเห็นว่า web design หลายๆคนจะทำการออกแบบโดยใช้ photoshop (.PSD)กับ illustrator (AI) ในการทำงาน ที่นี่เเล้วเราจะทำอย่างไรได้บ้างในการนำไปใช้งานกับหน้าเว็บไซต์จริงของเรา ซึ่งมันก็มีหลากหลายวิธีค่ะ อย่างเช่น การติดตั้ง Photoshop plugin ต่างๆ ลงไป โดยที่เห็นก็จะมี CSS Hat ซึ่งตัวนี้เราจะต้องทำการเสียเงินซึ่งมาเพื่อติดตั้ง
_____________________________________________________________________________________________
บทความนี้เเป็นบทความที่จัดทำขึ้นเพื่อเนะนำเครื่องมือช่วยสำหรับนักพัฒนา CSS ซึ่งเป็นความรู้พื้นฐานในการพัฒนา JavaScrip, JQuery หรือเเม้กระทั้ง Ajax ต่อไป ทั้งนี้สามารถดูรายละเอียด TIP ต่างๆ ได้ที่นี่ค่ะ เเละขอเเนะนำความรู้ที่เกี่ยวข้องกับโดยสามารถศึกษาได้จากบทเรียน CSS ได้ที่นี่ เพื่อเพิ่มความเข้าใจในการใช้งานเครื่องมือต่างๆ ค่ะ
_____________________________________________________________________________________________
ส่วนของฟรี ที่เราจะมีเเนะนำในวันนี้ก็คือ css3ps ซึ่งเราสามารถดาวน์โหลดได้จาก http://css3ps.com/Download/ พร้อมกับวิธีการติดตั้งในเว็บเลยการใช้งานก็ง่ายๆค่ะ เมื่อเราทำการติดตั้งเรียบร้อยเเล้วให้ทำการเปิด Photoshop จากนั้นเข้าที่ Menu > Windows > Extension > css3ps เพื่อทำการเปิด เครื่องมือขึ้นมา ดังภาพในตัวอย่างค่ะ
หลังจากนั้นให้เราทำการเปิดไฟล์ .PSD ที่เราออกเเบบไว้ค่ะ
จากภาพตัวอย่างนะค่ะ เราต้องการ ปุ๋มสีแดง "Free Consultation" ให้เราทำการเลือก Layers ของปุ๋มสีแดง ที่นี่ให้คลิก css3ps ตามรู้ที่ 3
รอประมาณ 5 วินาทีค่ะ เราก็จะได้ CSS ของ ปุ๋มสีแดง มาเเล้วค่ะ เราสามารถนำมาประยุกต์ใช้งานได้อีกค่ะ[/color]
TIP : การแปลงไฟล์ .PSD เป็น CSS (1)
Moderator: mindphp, ผู้ดูแลกระดาน
- thatsawan
- PHP VIP Members
- โพสต์: 28508
- ลงทะเบียนเมื่อ: 31/03/2014 10:02 am
- ติดต่อ:
- fern2535
- PHP Super Member
- โพสต์: 317
- ลงทะเบียนเมื่อ: 04/08/2015 10:18 am
ผู้ใช้งานขณะนี้
สมาชิกกำลังดูบอร์ดนี้: ไม่มีสมาชิกใหม่ และบุคลทั่วไป 60