ใบงานที่ 1

เรื่อง ส่วนประกอบบนโปรแกรม Dreamweaver ระดับ

ชั้นมัธยมศึกษาปี ที่ 3
รหัสวิชา ง 33101 รายวิชา การงานอาชีพและเทคโนโลยี 3 กล่่ม
สาระการเรียนรู้การงานอาชีพและเทคโนโลยี

ชื่อ กนกวรรณ สก่ล ชำานาญเพ็ชร์ ชั้นม. 3/5 เลขที่ 22

คำาสัง่
1. ให้นักเรียนบอกส่วนประกอบต่างๆ บนโปรแกรม
Dreamweaver

1 2 3 4 6
5

ร.ร.บ.ด.๒ \ ใบความร้้ 1-2

ฉบับที่ 1 : 17 พฤษภาคม 2553

ws 08-3-03
 7 8 9 1
11
1. คือ ไตเติลบาร์
2. คือ เมน้ บาร์
3. คือ ชื่อเรื่องเวปเพจ
4. คือ Insert ท้ลบาร์
5. คือ ท้ลบาร์
6. คือ กล่่ม panet
7. คือ Tag Selecbar
8. คือ เอกสารที่เปิ ดอย่้
9. คือ properties inspecter

10. คือ ปรับขนาดวินโดว์

11. คือ ขนาดข้อม้ล และรายละเอียดการดาวน์โหลด

ร.ร.บ.ด.๒ \ ใบความร้้ 2-2

ฉบับที่ 1 : 17 พฤษภาคม 2553

ws 08-3-03
 2. จงอธิบายลักษณะการทำางานของม่มมองการทำางานทั้ง 3 ม่ม
มองดังนี้
1. ม่มมองออกแบบ (Design View)
การใช้ม่มมองนี้ ให้คลิกที่ เพื่อแสดงหน้าจอ
สำาหรับการออกแบบและจัดองค์ประกอบของเว็บเพจ ซึ่ง
สามารถทำาการตกแต่งสีสันของหน้าเว็บเพจได้อย่างอิสระ
โดยไม่ต้องทำางานกับภาษา HTML หรือกับคำาสัง่ สคริปต์
ต่าง ๆ
2.ม่มมองโค้ด HTML (Code View)
Adobe Dreamweaver CS3 นั้ นจะมีม่มมองในการทำางาน
อย่้ 3 แบบ คือ Code View, Split View และ Design
View
ซึ่งมีไอคอนให้เลือกอย่้ท่ี Toolbar ในแถบเครื่องมือ ซึ่ง
มีรายละเอียดการใช้งานดังนี้
การให้ม่มมองนี้ ให้คลิกที่ จะแสดงโค้ด HTML
หรือ Script ในหน้าเว็บที่กำาลังทำางานอย่้ ซึ่งม่มมองนี้
สามารถใช้ในการเพิ่มเติม
หรือแก้ไขโค้ดให้เว็บไซต์
3.ม่มมองโค้ดและออกแบบ (Code & Design View)
การใช้ม่มมองนี้ ให้คลิกที่ จะแสดงทั้งโค้ดและหน้า
เว็บเพจ (Design) ที่กำาลังทำางานอย่้พร้อม ๆกัน
ร.ร.บ.ด.๒ \ ใบความร้้ 3-2
ฉบับที่ 1 : 17 พฤษภาคม 2553

ws 08-3-03
 ทำาให้สามารถเปรียบเทียบด้ผลลัพธ์ของโค้ดที่ได้สร้างขึ้น
มาในร้ปแบบของเว็บเพจ (การทำางานกับโค้ดต้องมีความร้้
เกี่ยวกับภาษา HTML)
3. แถบ Insert Bar ช่วยในการทำางานด้านใด จงยกตัวอย่าง
ประกอบ
คือ แถบเครื่องมือที่ประกอบไปด้วยป่ ่มคำาสัง่ ที่ใช้ในการแทรกออป
เจ็คต่าง ๆลงไปในว็บเพจ ซึ่งจะแยกเป็ นหมวดหม่้ด้วยแท็บ เช่น
table กล่่มคำาสัง่ ที่ใช้สำาหรับแทรกตาราง แถว คอลัมม์

ร.ร.บ.ด.๒ \ ใบความร้้ 4-2

ฉบับที่ 1 : 17 พฤษภาคม 2553

ws 08-3-03