About DwThai.Com 00

DwThai.Com

Tip and Trick Dreamweaver

ก่อตั้งเมื่อปีพุทธศักราช ๒๕๔๖

Go to Post-iT Sign Guestbook

ค้นหาข้อมูลใน DwThai.Com

เรียกใช้ External Stylesheet (CSS) ด้วยการ Drag & Drop [Article ID : 2]

เรื่อง : เรียกใช้ไฟล์ CSS ด้วยการลากวาง

โปรแกรม Dreamweaver มีความสามารถด้านการลากและวาง หรือ Drag & Drop เพื่อช่วยให้ผู้ใช้งานโปรแกรม ไม่ต้องพิมพ์โค้ดด้วยตนเอง สำหรับในบทความนี้จะมาแนะนำ การลากและวางเพื่อเรียกใช้งานไฟล์ CSS ในแบบ External Stylesheet (CSS ที่แยกเก็บโค้ดไว้เป็นไฟล์ต่างหาก เช่น design.css เป็นต้น)

วิธีการเรียกใช้งานไฟล์ CSS ในแบบลากและวาง

ก่อนที่จะไปดูขั้นตอนต่าง ๆ ให้ทำการเปิดไฟล์เว็บเพจขึ้นมาไว้กับโปรแกรม Dreamweaver จากนั้นปฏิบัติตาม ดังนี้

1. คลิกเลือกมุมมองของโปรแกรมไปในส่วนของ Code View ดังรูป

2. จากนั้นให้เปิด Files Panel ขึ้นมา (Menu -> Window -> Files) ดังรูป

3. ที่หน้าต่าง Files ให้เลือกไฟล์ CSS ที่ต้องการนำมาใช้กับเว็บเพจที่เปิดอยู่ *ไฟล์นามสกุล .css
4. ทำการคลิกเลือกไฟล์ CSS และทำการลาก (Drag) ไปวางไว้ในตำแหน่งของโค้ด ดังรูป

5. ทำการปล่อยเมาท์เพื่อวางไฟล์ (Drop) ที่ตำแหน่งที่ต้องการ ดังรูป

6. โปรแกรมจะทำการสร้างโค้ดในการเรียกใช้ไฟล์ CSS ให้ ซึ่งโค้ดที่ได้ คือ

<link rel="stylesheet" type="text/css" href="design.css">

ซึ่งเป็นโค้ดที่ใช้ในการเรียกใช้ CSS ในรูปแบบ External Stylesheet

ความสามารถด้าน Drag & Drop ของโปรแกรม Dreamweaver ยังมีอีกมากครับ ซึ่ง DwThai.Com จะนำเสนอกันต่อ ๆ ไป
...โปรดคอยติดตาม

About the Author

Mr.Sittichai Raksasuk

Sittichai is a Web Developer and Web Technology Instructor for over 10 yrs. He is also a webmaster of dwthai.com and author jQuery with Dreamweaver (2010). DwThai.Com is a website for web developer using Adobe Dreamweaver.

Contact with him : dwthai@gmail.com

บทความอื่นที่คุณอาจสนใจ

ทำสไลด์โชว์ (Slideshow) แสดงรูปภาพประกอบข่าว โดยใช้ข้อมูลจาก Database

เรื่อง : วิธีการสร้างรูปภาพแบบ Slideshow โดยใช้ข้อมูลจาก Database ผู้อ่านหลายท่านอาจจะเคยเข้าเว็บสำนั...

การสร้างโปรแกรมสำหรับการค้นหา (Search) ข้อมูลจาก Database

เรื่อง : การสร้างโปรแกรมสำหรับการค้นหา (Search) ข้อมูลจาก Database บทความนี้คงถูกอกถูกใจของใครหลายคนเป็นแน่ เ...

สร้างปุ่มกดให้กลายเป็น Link (Button Link with Dreamweaver)

เรื่อง : การทำปุ่มกดให้เป็นลิงค์เพื่อกดไปหน้าอื่นด้วย Dreamweaver โดยปรกติถ้าต้องการสร้าง Link บนหน้าเว็บเพจ เราต้อ...

สร้าง Popup Menu ด้วย Spry Menu Bar (CS Only)

เรื่อง : การสร้างเมนูเว็บไซต์ด้วย Spry Menu Bar *Dreamweaver CC ไม่มีให้ใช้ครับ Spry เป็น Framework...