Dream

ออกแบบและสร้างเว็�บสว็ยด้ว็ย

Dreamweaver

•ลงมื�อสร้างเว็�บให้เฉี�ยบ•จั�ด้ห้น้าเว็�บเพจัด้ว็ยตาร้างและเฟร้มื

•แกไขเว็�บเพจัร้ว็ด้เร้�ว็ด้ว็ย Style Sheet

กาว็ส !การ้สร้างเว็�บร้ะด้�บมื�อโปร้• เพ$%มืล กเล!น้ด้ว็ย Behavior

•สร้างเว็�บมื�ลต$มื�เด้�ย

การ้เขาส !โปร้แกร้มื การ้เขาส !โปร้แกร้มื Dream weaverDream weaver

•เขาใจัการ้ใช้เคร้�%องมื�อต!างๆเขาใจัการ้ใช้เคร้�%องมื�อต!างๆ•สร้างเว็�บไซต*ต�+งแต!ตน้สร้างเว็�บไซต*ต�+งแต!ตน้

การ้เขาส !โปร้แกร้มื Dream weaver เร้$%มืตน้การ้ใช้งาน้โปร้แกร้มื Dream

weaver1. คลิ�กที่��ปุ่ม start2. เลิ��อนเมาส์�ไปุ่ที่�� Program3. เลิ��อนเมาส์�ไปุ่ที่��คลิ�กเลิ�อกเมน� Macromedia4. เลิ��อนเมาส์�ไปุ่ที่��คลิ�กเลิ�อกค�าส์��ง Macromedia Dream weaver เพื่��อเรี�ยกใช้�โปุ่รีแกรีม

การ้เขาส !โปร้แกร้มื Dream weaver เร้$%มืตน้การ้ใช้งาน้โปร้แกร้มื Dream

weaver

ส!ว็น้ปร้ะกอบโปร้แกร้มื Dream weaver ส!ว็น้ปร้ะกอบต!างๆของโปร้แกร้มืDream weaver

1. แถบไตเต$+ลบาร้* (Title bar) ค�อ ส!ว็น้ที่�%แสด้งช้�%อโปร้แกร้มืที่�%ก.าล�งเป/ด้ใช้งาน้ป01มื Close ป/ด้ห้น้าต!างป01มื Minimize ย!อห้น้าต!างลง ป01มื Maximize ขยายห้น้าต!างเต�มืจัอภาพ ป01มื Restore ค�น้สภาพห้น้าต!าง

ส!ว็น้ปร้ะกอบโปร้แกร้มื Dream weaver

2. แถบค.าส�%งเมืน้ (Menu Bar) ค�อ ส!ว็น้ที่�%ร้ว็มืค.าส�%งการ้ที่.างาน้และค.าส�%งค�ย*ล�ด้Fileจั�ด้การ้เป/ด้ ป/ด้ บ�น้ที่3กขอมื ลEdit จั�ด้การ้ห้น้าเว็�บเพ�จั ค�ด้ลอก ว็างInsert แที่ร้กร้ ปภาพ ตาร้าง FlashView มื0มืมืองของเคร้�%องมื�อModify จั�ด้การ้ แกไข ค!าต!างๆText การ้จั�ด้การ้ขอคว็ามืCommand ค.าส�%งใน้การ้จั�ด้การ้ HTMLSite จั�ด้การ้เว็�บเพ�จัWindow ซ!อน้/แสด้ง เคร้�%องมื�อต!างๆHelp ต�ว็ช้!ว็ยแน้ะน้.า


3. แถบเคร้�%องมื�อเอกสาร้ (Document Bar) ค�อ เคร้�%องมื�อใน้การ้จั�ด้การ้งาน้ด้าน้ HTML ที่�%ว็ไป เช้!น้ มื0มืมืองแสด้งเอกสาร้ร้ ปแบบ HTML

มื0มืแสด้งร้ ปแบบภาษา HTML และแสด้งพ�+น้ที่�%ออกแบบ

มื0มืมืองแสด้งพ�+น้ที่�%ออกแบบ

ส.าห้ร้�บต�+งช้�%อเว็�บเพ�จัใน้ส!ว็น้ไตเต$+ลบาร้*

ส.าห้ร้�บจั�ด้การ้แฟ5มืเว็�บเพ�จั

ส.าห้ร้�บใช้ที่ด้ลองด้ เว็�บเพ�จัผ่!าน้โปร้แกร้มื browser

ส.าห้ร้�บจั�ด้การ้มื0มืมืองการ้ที่.างาน้อ�%น้ๆเพ$%มืเต$มื เช้!น้ Grid, Rulers

http://kruwan.school.in.th/dream/images/grid_view.jpg

http://kruwan.school.in.th/dream/images/ruler_view.jpg

ส!ว็น้ปร้ะกอบโปร้แกร้มื Dream weaver ส!ว็น้ปร้ะกอบต!างๆของโปร้แกร้มืDream weaver

4. แถบเคร้�%องมื�อ (Tool Bars) ค�อ เคร้�%องมื�อใน้การ้จั�ด้การ้ภาษา HTML โด้ยจั�ด้เป7น้ห้มืว็ด้ห้มื ! เช้!น้ 4.1 แที่�บ Common จัะเป7น้ส!ว็น้ที่�%ร้ว็บร้ว็มือ�อบเจั�กต*ต!าง ที่�%เร้�ยกใช้งาน้บ!อย ได้แก! การ้แที่ร้กภาพ การ้แที่ร้กตาร้าง การ้ล$งค* เป7น้ตน้


2. แที่�บ Layout เป7น้ส!ว็น้ร้ว็มือ�อบเจั�กต*ที่�%ช้!ว็ยใน้การ้จั�ด้องค*ปร้ะกอบของห้น้าเว็�บเพ�จัให้ง!ายกว็!าเด้$มื


3. แที่!บ Text รีวมอ!อบเจ็!กต์�การีใช้�งานต์�วอ�กษรีที่��อย�'ภายในเว!บเพื่!จ็


5. แที่�บFramesใช้ส.าห้ร้�บการ้แบ!งพ�+น้ที่�%ใน้การ้แสด้งผ่ลของห้น้าเว็�บเพ�จัให้ออกเป7น้ส!ว็น้ย!อย


6. แที่�บ Forms ร้ว็มือ�อบเจั�กต*ที่�%ใช้ใน้การ้สร้างแบบฟอร้*มื และต�ว็เล�อกต!างๆ


7. แที่�บ Templates ก.าห้น้ด้ร้ ปแบบให้ก�บเว็�บเพ�จั ห้ร้�อเว็�บไซต*


8. แที่�บ Characters เป7น้กล0!มือ�อบเจั�กต*ที่�%ใช้ส.าห้ร้�บแที่ร้กต�ว็อ�กษร้ และส�ญล�กษณ์*พ$เศษต!าง ๆ


9. แที่�บ Media ใช้ส.าห้ร้�บแที่ร้กส!ว็น้ที่�%เป7น้ไฟล*ว็$ด้�โอ ภาพเคล�%อน้ไห้ว็ Flash Java applet ActiveX ห้ร้�อ Plugin ใน้ห้น้าเว็�บเพ�จั


5. พ�+น้ที่�%ออกแบบงาน้ (Stage) ค�อ พ�+น้ที่�%ส.าห้ร้�บการ้ออกแบบการ้ที่.างาน้ใน้ล�กษณ์ะ WYSIWYG อ!าน้ว็!า ว็$สส$ว็$ก (What You See Is What You Get) น้�%น้ค�อ ค0ณ์ออกแบบห้น้าเว็�บเพ�จั ห้ร้�อเว็�บไซต*มืาอย!างไร้ ก�จัะเห้�น้งาน้ของค0ณ์เป7น้แบบน้�+น้


6. แถบเคร้�%องมื�อแสด้งช้�%อเว็�บที่�%ก.าล�งเป/ด้ใช้งาน้


7. แถบเคร้�%องมื�อ Properties ค�อ แถบเคร้�%องมื�อส.าห้ร้�บก.าห้น้ด้ค!าของเคร้�%องมื�อต!างๆของโปร้แกร้มื เช้!น้ ก.าห้น้ด้ร้ ปแบบของต�ว็อ�กษร้ ก.าห้น้ด้ล$งค*ต!างๆ เป7น้ตน้


8. แถบเคร้�%องมื�อ Panel เป7น้ส!ว็น้ของห้น้าต!างช้!ว็ยจั�ด้การ้คว็ามืสามืาร้ถต!างๆเพ$%มืเต$มื เช้!น้ Design , Site , Behavior

การ้สร้างเว็�บไซต*ให้มื! (New Site)

การ้สร้างเว็�บไซต*ให้มื! (New Site)การ้สร้างเว็�บเพ�จัแต!ละเว็�บเพ�จั จัะตองที่.าการ้สร้างโฟลเด้อร้*เก�บไฟล*เอกสาร้ และไฟล*ที่�%เก�%ยว็ของไว็เฉีพาะ เพ�%อที่.าให้สามืาร้ถจั�ด้การ้เว็�บเพ�จัได้อย!างเป7น้ร้ะเบ�ยบ และง!ายต!อการ้แกไขขอมื ลข�+น้ตอน้การ้สร้างเว็�บไซต*ให้มื!

1. คล$กเมืน้ Site เล�อก New Site...

2. จัากน้�+น้จัะพบห้น้าต!างด้�งร้ ป แลว็ให้เร้าต�+งช้�%อ site ของเร้า (คว็ร้ต�+งช้�%อให้เห้มืาะสมืก�บเว็�บเพ�จัที่�%เร้าสร้าง) คล$กที่�%แที่�บ Advance จัากน้�+น้กด้ป01มื Next เพ�%อไปย�งข�+น้ตอน้ต!อไป


3. ที่�%แที่�บ Advance จัะปร้ากฎ Site Definition For .. (ตามืช้�%อไซต*)คล$ก Local Info ใน้ช้!อง Category ห้มืายเลข 1 Site Name : ช้�%อเว็�บไซต*ของเร้าห้มืายเลข 2 Local Root Folder : ห้องเก�บเว็�บไซต*ห้มืายเลข 3 Default Image Folder : ห้องเก�บไฟล*ร้ ปภาพ


ถาตองการ้เล�อกห้องเก�บโฟลเด้อร้*/ห้องเก�บร้ ปภาพ คล$ก ตามืห้มืายเลข 2 และ 3 กด้ป01มื Select


4. ห้ล�งจัากกด้ป01มื OK แลว็ จัะปร้ากฎ ร้าละเอ�ยด้ของห้องเก�บเว็�บไซต*ที่�% Panel Filesร้ายละเอ�ยด้อ�%น้ๆ

การ้สร้างเว็�บเพ�จัให้มื! (New Page)

การ้สร้างเว็�บเพ�จัให้มื! (New Page)ใน้การ้สร้างเว็�บเพ�จัให้มื!ใน้แต!ละเว็�บไซต* ผ่ ด้ แลเว็�บคว็ร้จัะสร้างเว็�บห้น้าแร้กของเว็�บไซต* ช้�%อว็!า index.htm , index.html , default.htm , default.html , index.php , index.asp , index.aspx เป7น้ตน้เพร้าะเมื�%อเร้าน้.าเว็�บเพ�จัของเร้าข3+น้ส !เว็�บไซต*แลว็ เว็�บที่�%ให้บร้$การ้ใน้การ้ฝากเว็�บไซต* (web server) จัะคน้ห้าเว็�บใน้ช้�%อขางตน้ก!อน้ ถาห้าไมื!พบก�จัะแจังขอคว็ามืแสด้งว็!าไมื!พบห้น้าเว็�บด้�งกล!าว็1. คล$กที่�%เมืน้ File > New...


2. เล�อก แที่�บ General3. เล�อกปร้ะเภที่แฟ5มืใน้ Category :- Basic Page : HTML พ�+น้ฐาน้- Dynamic Page : เพ�จัแบบเปล�%ยน้แปลง เช้!น้ php , asp ,aspx jsp เป7น้ตน้- Template Page : เพ�จัแบบตน้แบบ- Other : เพ�จัแบบอ�%น้ๆ เช้!น้ Action script- CSS Style Sheets : สไตล*ช้�ต- Framesets : สร้างเพ�จัแบบใช้เฟร้มื- Page Designs : เพ�จัส.าเร้�จัร้ ปที่�%โปร้แกร้มืเตร้�ยมืไว็ให้

4 เล�อกป01มื creat


4. พ$มืพ*ขอคว็ามืห้ร้�อแที่ร้กร้ ปภาพได้ตามื

คว็ามืตองการ้


การ้ก.าห้น้ด้ร้ายละเอ�ยด้ให้ก�บเว็�บเพ�จั (Page properties)การ้ก.าห้น้ด้ค!าเร้$%มืตน้ให้ก�บเว็�บเพ�จัแต!ละห้น้า เช้!น้ Title Bar , ส�พ�+น้ห้ล�ง ห้ร้�อภาพเบ�+องห้ล�ง , ก.าห้น้ด้ส�ของล$งค*แบบต!างๆ ด้�งน้�+1 คล$กเมืน้ Modify > Page Properties...2 ปร้ากฏกร้อบห้น้าต!าง Page Properties


Title : ก.าห้น้ด้ขอคว็ามืห้�ว็เร้�%องที่�%ตองการ้แสด้งบน้ไตเต$+ลบาร้* Background Image : ก.าห้น้ด้พ�+น้ห้ล�งด้ว็ยร้ ปภาพ Background : ก.าห้น้ด้ส�ของพ�+น้ห้ล�ง Text : ก.าห้น้ด้ส�ของอ�กษร้ Links : ก.าห้น้ด้ส�ของต�ว็อ�กษร้ที่�%เป7น้จั0ด้ล$งค* Visited Link : ก.าห้น้ด้ส�ของจั0ด้ล$งค*ที่�%เคยผ่!าน้การ้เร้�ยกด้ มืาแลว็ Active Links : ก.าห้น้ด้ส�ของจั0ด้ล$งค*ที่�%ก.าล�งที่.างาน้อย ! Left Margin : ก.าห้น้ด้ร้ะยะขอบด้าน้ซายของขอคว็ามืก�บเว็�บเพ�จั Top Margin : ก.าห้น้ด้ร้ะยะขอบด้าน้บน้ของเว็�บเพ�จั Margin Width / Margin Height : ก.าห้น้ด้ร้ะยะขอบส.าห้ร้�บ Browser Netscape Navigator Document Encoding : ก.าห้น้ด้การ้แสด้งผ่ลภาษาไที่ย Tracing Images : ก.าห้น้ด้ร้ ปภาพที่�%จัะใช้ใน้การ้กะร้ะยะตอน้ออกแบบ Preview จัะไมื!แสด้ง การ้จั�ด้และตกแต!งขอคว็ามื


การ้พ$มืพ*ขอคว็ามืบน้เว็�บเพ�จัด้ว็ยโปร้แกร้มื Dream weaver สามืาร้ถจั�ด้การ้ได้ห้ลายว็$ธี� เช้!น้1. พ$มืพ*ขอคว็ามืลงบน้พ�+น้ที่�%ออกแบบเว็�บเพ�จั (Stage)2. พ$มืพ*ขอคว็ามืโด้ยโปร้แกร้มื Word processing เช้!น้ MS Word , Notepad แลว็ค�ด้ลอกขอคว็ามืมืาใส!ใน้เว็�บเพ�จั3. พ$มืพ*ขอคว็ามืเป7น้เอกสาร้ โด้ยใช้ภาษา HTML


การ้พ$มืพ*ขอคว็ามืบน้เว็�บเพ�จัการ้พ$มืพ*ขอคว็ามืเร้าสามืาร้ถใส!ขอคว็ามื โด้ยการ้พ$มืพ*ขอคว็ามืใน้บร้ร้ที่�ด้ที่�%ตองการ้ได้ โด้ยการ้คล$กเมืาส*ลงบน้ห้น้าเว็�บ ( ส�งเกตจัากส�ญล�กษณ์* ) จัากน้�+น้พ$มืพ*ขอคว็ามืที่�%เร้าตองการ้ลงไป ต�ว็อย!าง


การ้ข3+น้ย!อห้น้าให้มื! ใน้โปร้แกร้มื Dreamweaver จัะมื�ข�+น้ตอน้การ้ข3+น้ย!อห้น้าให้มื!ได้ 2 ว็$ธี� ค�อ1. กด้ป01มื Enter โด้ยโปร้แกร้มืจัะแที่ร้กบร้ร้ที่�ด้ว็!างก!อน้และห้ล�งขอคว็ามื ที่.าให้เก$ด้ร้ะยะห้!างร้ะห้ว็!างบร้ร้ที่�ด้มืาก จั3งเห้มืาะส.าห้ร้�บที่.าห้�ว็ขอห้ล�ก2. กด้ป01มื Shift+Enter ห้ร้�อ กด้ป01มื ใน้กล0!มืเคร้�%องมื�อ Characters ว็$ธี�น้�+เห้มืาะส.าห้ร้�บข3+น้บร้ร้ที่�ด้ให้มื! แบบเน้�+อห้าต$ด้ก�น้


ว็$ธี�เปล�%ยน้ร้ ปแบบต�ว็อ�กษร้1. ลากเมืาส*คล0มืขอคว็ามืที่�%ตองการ้เปล�%ยน้ร้ ปแบบให้เป7น้แถบส�ด้.า2. คล$กป01มื เล�อกร้ ปแบบของต�ว็อ�กษร้ 3. ต�ว็อ�กษร้ที่�%มื�แถบส�จัะเปล�%ยน้ร้ ปแบบตามืร้ ปแบบที่�%เล�อก


ว็$ธี�จั�ด้ล�กษณ์ะขอคว็ามื1. ลากเมืาส*คล0มืขอคว็ามืที่�%ตองการ้เปล�%ยน้ร้ ปแบบให้เป7น้แถบส�ด้.า2. คล$กป01มื เพ�%อเปล�%ยน้ร้ ปแบบอ�กษร้เป7น้ต�ว็ห้น้า คล$กป01มื เพ�%อเปล�%ยน้ร้ ปแบบอ�กษร้เป7น้ต�ว็เอ�ยง3. ต�ว็อ�กษร้ที่�%มื�แถบส�จัะเปล�%ยน้ร้ ปแบบตามืร้ ปแบบที่�%เล�อก

ว็$ธี�เปล�%ยน้ขน้าด้ต�ว็อ�กษร้1. ลากเมืาส*คล0มืขอคว็ามืที่�%ตองการ้เปล�%ยน้ขน้าด้ต�ว็อ�กษร้ให้เป7น้แถบส�ด้.า2. คล$กป01มื เล�อกร้ ปแบบของต�ว็อ�กษร้ 3. ต�ว็อ�กษร้ที่�%มื�แถบส�จัะเปล�%ยน้ร้ ปแบบตามืร้ ปแบบที่�%เล�อก


ว็$ธี�เปล�%ยน้ส�ต�ว็อ�กษร้1 .ลากเมืาส*คล0มืขอคว็ามืที่�%ตองการ้เปล�%ยน้ขน้าด้ต�ว็อ�กษร้

ให้เป7น้แถบส�ด้.า2. คล$กป01มื ห้ร้�อพ$มืพ*ร้ห้�สส�ใน้ช้!อง 3. ต�ว็อ�กษร้ที่�%มื�แถบส�จัะเปล�%ยน้ร้ ปแบบตามืร้ ปแบบที่�%เล�อก

การ้จั�ด้ว็างต.าแห้น้!งของขอคว็ามื1 .ลากเมืาส*คล0มืขอคว็ามืที่�%ตองการ้จั�ด้ต.าแห้น้!งให้เป7น้แถบ

ส�ด้.า2. คล$กป01มื เพ�%อเปล�%ยน้ร้ ปแบบอ�กษร้เป7น้ต�ว็

ห้น้า3. คล$กป01มื เพ�%อจั�ด้ขอคว็ามืช้$ด้ซาย4. คล$กป01มื เพ�%อจั�ด้ขอคว็ามือย !ก3%งกลาง5. คล$กป01มื เพ�%อจั�ด้ขอคว็ามืช้$ด้ขว็า6. คล$กป01มื เพ�%อจั�ด้ขอคว็ามืช้$ด้ขอบด้าน้ซายและด้าน้ขว็า


การ้สร้างเสน้ค�%น้ร้ะห้ว็!างบร้ร้ที่�ด้ คล$กเล�อกบร้$เว็ณ์ที่�%ตองการ้แที่ร้กเสน้ คล$ก จัะได้ด้�งร้ ป

การ้ใส!ล.าด้�บ (Bullet) และต�ว็เลขก.าก�บเร้าสามืาร้ถใส!ล.าด้�บห้�ว็ขอห้ร้�อต�ว็เลขก.าก�บ ให้ก�บเน้�+อห้า ใน้

แต!ละบร้ร้ที่�ด้เพ�%อจั�ด้ล.าด้�บเน้�+อห้าให้เป7น้ร้ะเบ�ยบมืากข3+น้ ด้�งน้�+ป01มื แสด้งล.าด้�บห้�ว็ขอป01มื แสด้งต�ว็เลขก.าก�บ


ว็$ธี�เปล�%ยน้ส�ต�ว็อ�กษร้1 .ลากเมืาส*คล0มืขอคว็ามืที่�%ตองการ้เปล�%ยน้ขน้าด้ต�ว็อ�กษร้

ให้เป7น้แถบส�ด้.า2. คล$กป01มื ห้ร้�อพ$มืพ*ร้ห้�สส�ใน้ช้!อง 3. ต�ว็อ�กษร้ที่�%มื�แถบส�จัะเปล�%ยน้ร้ ปแบบตามืร้ ปแบบที่�%เล�อก

การ้จั�ด้ว็างต.าแห้น้!งของขอคว็ามื1 .ลากเมืาส*คล0มืขอคว็ามืที่�%ตองการ้จั�ด้ต.าแห้น้!งให้เป7น้แถบ

ส�ด้.า2. คล$กป01มื เพ�%อเปล�%ยน้ร้ ปแบบอ�กษร้เป7น้ต�ว็

ห้น้า3 .คล$กป01มื เพ�%อจั�ด้ขอคว็ามืช้$ด้ซาย4 .คล$กป01มื เพ�%อจั�ด้ขอคว็ามือย !ก3%งกลาง5 .คล$กป01มื เพ�%อจั�ด้ขอคว็ามืช้$ด้ขว็า6 .คล$กป01มื เพ�%อจั�ด้ขอคว็ามืช้$ด้ขอบด้าน้ซายและด้าน้ขว็า


ปร้ะเภที่ของไฟล*ร้ ปภาพเร้าสามืาร้ถน้.าร้ ปภาพมืาปร้ะกอบบน้ห้น้าเว็�บเพ�จัได้ เช้!น้

แที่ร้กภาพใน้เว็�บเพ�จั ใส!เสน้กร้อบเป7น้ร้ ปภาพ และการ้แสด้งภาพให้เป7น้พ�+น้ห้ล�งของเว็�บเพ�จั ช้น้$ด้ของภาพที่�%จัะน้.ามืาปร้ะกอบบน้เว็�บเพ�จั คว็ร้จัะตองมื�ขน้าด้เล�ก เพ�%อน้.าไปเร้�ยกใช้บน้เว็�บเพ�จัได้อย!างร้ว็ด้เร้�ว็ เช้!น้ GIF, JPEG และ PNG ซ3%งใน้การ้เล�อกใช้ฟอร้*แมืตภาพได้ย!างเห้มืาะสมืเร้าคว็ร้ตองที่.าคว็ามืเขาใจัล�กษณ์ะการ้บ�บอ�ด้ขอมื ลของแต!ละฟอร้*แมืต เพร้าะแต!ละแบบจัะบ�บอ�ด้ขอมื ลได้อย!างมื�ปร้ะส$ที่ธี$ภาพส งส0ด้เมื�%อน้.ามืาใช้ก�บภาพที่�%เห้มืาะสมื

ไฟล*สก0ล JPG (Joint Photographer’s Experts Group)เป7น้ไฟล*ห้น้3%งที่�%น้$ยมืใช้บน้ Internet มื�คว็ามืละเอ�ยด้ส ง และใช้ส�จั.าน้ว็น้มืาก (สน้�บสน้0น้ถ3ง 24 bit color) ไฟล*ช้น้$ด้น้�+มื�กจัะใช้ก�บภาพถ!ายที่�%น้.ามืาสแกน้ และตองการ้น้.าไปใช้บน้อ$น้เที่อร้*เน้�ต เพร้าะให้คว็ามืคมืช้�ด้และคว็ามืละเอ�ยด้ของภาพส ง จั0ด้เด้!น้สน้�บสน้0น้ส�ได้ถ3ง 24 bit สามืาร้ถก.าห้น้ด้ค!าการ้บ�บไฟล*ได้ตามืที่�%ตองการ้ มื�ร้ะบบแสด้งผ่ลแบบห้ยาบและค!อยๆ ขยายไปส !ละเอ�ยด้ใน้ร้ะบบ Progressive มื�โปร้แกร้มืสน้�บสน้0น้การ้สร้างจั.าน้ว็น้มืาก เร้�ยกด้ ได้ก�บ Graphics Browser ที่0กต�ว็


การ้แที่ร้กร้ ปภาพบน้เว็�บเพ�จัการ้แที่ร้กร้ ปภาพบน้ว็�บเพ�จั1 .คล$กเมืาส* ที่�%ไอคอน้ ใน้ห้น้าต!างอ�อบเจั�กต* ห้ร้�อเล�อก

ค.าส�%ง Insert>Image ห้ร้�อกด้ <Crtl+Alt+i> เพ�%อเล�อกร้ ปภาพที่�%ตองการ้


การ้จั�ด้ว็างต.าแห้น้!งของร้ ปภาพ1. คล$กเล�อกร้ ปภาพที่�%ตองการ้จั�ด้ต.าแห้น้!ง2. ที่�% Properties เล�อกห้�ว็ขอ Align Default : ค!าห้ล�ก ค�อ Baseline ขอบล!างตร้งก�บแน้ว็

ขอคว็ามืBaseline : ขอบล!างตร้งก�บแน้ว็ขอคว็ามืTop : ขอบบน้ตร้งก�บแน้ว็ขอคว็ามืMiddle : ก3%งกลางของภาพตร้งก�บขอบล!างขอคว็ามืButtom : ขอบล!างของภาพตร้งก�บแน้ว็ล!างของขอคว็ามืTexttop : ขอบบน้ของภาพตร้งก�บแน้ว็บน้ของขอคว็ามืAbsolute Middle : ก3%งกลางของภาพตร้งก�บก3%งกลางของขอคว็ามืAbsolute Bottom : ขอบล!างของภาพตร้งก�บแน้ว็ล!างของขอคว็ามืLeft : ภาพด้าน้ซายของขอคว็ามืRight : ภาพด้าน้ขว็าของขอคว็ามื


กร้ณ์�แที่ร้กร้ ปภาพลงไปใน้เว็�บเพ�จั แต!ไมื!ได้น้.าข3+น้อ$น้เที่อร้*เน้�ต จัะเก$ด้ปAญห้า

อางอ$งร้ ปภาพไมื!ถ กตอง ด้�งน้�+


การ้ปร้�บแต!งร้ ปภาพ1. การ้ปร้�บแต!งร้ายละเอ�ยด้ของร้ ปภาพห้ากเร้าตองการ้ปร้�บแต!งร้ายละเอ�ยด้ของร้ ปภาพ เช้!น้ ปร้�บขน้าด้ของร้ ปภาพให้ คล$ก เล�อกที่�%ร้ ปและปร้�บร้ายละเอ�ยด้ของร้ ปภาพได้ที่�%ห้น้าต!าง Properties

2. การ้ปร้�บขน้าด้ของภาพ คล$กที่�% ร้ ป เล�อก Properties ของร้ ป และก.าห้น้ด้ W : คว็ามืกว็าง , H : คว็ามืส ง ด้�งร้ ปห้ร้�อคล$กที่�%ร้ ป แลว็คล$กที่�% Handle (มื0มืร้ ป) แลว็ปร้�บขน้าด้ตามืคว็ามืตองการ้


3. การ้ใส!ขอคว็ามืก.าก�บภาพคล$กที่�%ร้ ปภาพที่�%ตองการ้ แลว็พ$มืพ*ขอคว็ามืก.าก�บภาพใน้

ช้!อง Alt ใน้ห้น้าต!าง Properties เมื�%อเร้าน้.าร้ ปภาพข3+น้โช้ว็* และใช้เมืาส*ช้�+ที่�%ร้ ปจัะมื�ค.าอธี$บายภาพ

ปร้ากฏ


4. ก.าห้น้ด้ร้ะยะของภาพจัากขอบของเว็�บเพ�จัห้ร้�อส$%งที่�%อย !ร้อบ ๆ ภาพ

V Space, H Space ซ3%งเป7น้ร้ะยะห้!างของแน้ว็ต�+งและแน้ว็น้อน้

ตามืล.าด้�บ จัากส!ว็น้น้�+เองที่.าให้เร้าสามืาร้ถว็างร้ ปภาพไว็ต.าแห้น้!งใด้ของเว็�บ

เพ�จัก.าห้น้ด้ร้ะยะของภาพจัากขอบของเว็�บเพ�จัใน้แน้ว็ต�+งและแน้ว็น้อน้

การ้แสด้งภาพเป7น้พ�+น้ห้ล�งเว็�บเพ�จั

2. เป/ด้ Dreamweaver เล�อก Modify>Page Properties.. ห้ร้�อกด้ค�ย* <Ctrl+J>

3. Click Mouse Browse.. จัะปร้ากฏได้อะล�อกบ�อกซ*ข3+น้มืาให้เล�อกไฟล*ร้ ปภาพ

4. เล�อกไฟล*ร้ ปภาพที่�%จัะน้.ามืาใช้เป7น้ฉีากห้ล�งของภาพ

5. Click mouse ป01มื OK6. Click mouse ป01มื Apply เพ�%อด้

ผ่ลล�พธี*ก!อน้แสด้งผ่ลที่�%ห้น้าจัอ7. Click mouse ป01มื OK

1. สร้างไฟล*ร้ ปภาพที่�%จัะน้.ามืาที่.าเป7น้พ�+น้ห้ล�งโด้ยใช้โปร้แกร้มืตกแต!งภาพ เช้!น้ Photoshop ห้ร้�อ Paint ซ3%งอาจัสร้างข3+น้ให้มื!ที่�+งห้มืด้ ห้ร้�ออาจัน้.า ภาพที่�%มื�อย !แลว็มืาตกแต!งก�ได้

การ้แสด้งภาพเป7น้พ�+น้ห้ล�งเว็�บเพ�จั

7. การ้ก.าห้น้ด้ขอบของร้ ปภาพคล$กที่�% ร้ ปภาพ แลว็ก.าห้น้ด้ คว็ามืห้น้าของร้ ปที่�% Border [0 ห้มืายถ3ง ไมื!มื�เสน้]เช้!น้ 3

การ้สร้างและแกไขตาร้างการ้สร้างตาร้างบน้เว็�บเพ�จัการ้ใช้ตาร้าง เห้มืาะส.าห้ร้�บการ้น้.าเสน้อขอมื ลจั.าน้ว็น้มืาก

เช้!น้ ขอมื ลการ้ซ�+อขาย ห้ร้�อสร้0ปปร้$มืาณ์ส$น้คาคงคล�งที่�%คว็ร้น้.ามืาจั�ด้ใน้ร้ ปแถว็

และคอล�มืน้* การ้สร้างตาร้างที่.าได้ 3 ว็$ธี� ค�อว็$ธี�ที่�% 1 เล�อกเมืน้ Insert>Table ห้ร้�อเล�อกเคร้�%องมื�อ ที่�%แที่�บ

เคร้�%องมื�อ Commonว็$ธี�ที่�% 2 กด้ค�ย* <Ctrl+Alt+T> ว็$ธี�ที่�% 3 เมืน้ Insert > Table ด้�งร้ ปโด้ยที่�+ง 3 ว็$ธี�น้�+จัะแสด้งได้อะล�อกบ�อกซ* Insert Table ส.าห้ร้�บ

ใช้ก.าห้น้ด้ร้ายละเอ�ยด้เก�%ยว็ก�บตาร้าง ด้�งร้ ปน้�+

การ้สร้างและแกไขตาร้าง

Rows จั.าน้ว็น้แถว็ที่�%ตองการ้Columns คอล�มืน้*ที่�%ตองการ้Width คว็ามืกว็างของตาร้างห้น้!ว็ยที่�%ใช้จัะเป7น้เปอร้*เซ�น้ต*

ห้ร้�อพ$กเซลก�ได้Border คว็ามืห้น้าของขอบตาร้างCell Padding ร้ะยะร้ะห้ว็!างขอคว็ามืใน้ตาร้างก�บขอบตาร้างCell Spacing ร้ะยะร้ะห้ว็!างแต!ละเซลล*ใน้ตาร้างเมื�%อคล$กเมืาส*ป01มื ก�จัะได้ตาร้างตามืร้าย

ละเอ�ยด้ที่�%ก.าห้น้ด้การีปุ่รี�บขนาดช้'องต์ารีางหากต์�องการีปุ่รี�บขนาด

ของช้'องต์ารีางให� คลิ�ก ที่��เส์�นต์ารีางแลิะลิากเมาส์�ปุ่รี�บขนาดได�


การ้แที่ร้กแถว็และคอล�มืน้*1. การ้แที่ร้กแถว็ 1. น้.าเคอร้*เซอร้*ไปว็างย�งต.าแห้น้!งที่�%ตองการ้จัะแที่ร้กแถว็ 2. คล$กเมืาส* ป01มืขว็าจัะปร้ากฏเมืน้ ย!อย ให้เล�อก

Table>Insert Row ห้ร้�อเล�อกค.าส�%ง Modify>Table>Insert Row จัากเมืน้ ห้ร้�อกด้ค�ย* <Crtl+M> ก�ได้

3. จัะปร้ากฏแถว็ข3+น้มืาห้น้3%งแถว็ ซ3%งมื�ขน้าด้ของเซลล*เที่!าก�บขน้าด้ของแถว็ เด้$มืที่�%เขาไปแที่ร้ก


การ้แที่ร้กคอล�มืน้*1. น้.าเคอร้*เซอร้*ไปว็างย�งต.าแห้น้!งที่�%ตองการ้จัะแที่ร้กคอล�มืน้*2. คล$กเมืาส*ป01มืขว็าจัะปร้ากฏเมืน้ ย!อย ให้เล�อก

Table>Insert Column ห้ร้�อเล�อกค.าส�%ง Modify>Table>Insert Column จัากเมืน้ ห้ร้�อกด้ค�ย* <Crtl+Shift+A> จัะปร้ากฏคอล�มืน้*ให้มื!แที่ร้กข3+น้มืาตร้งต.าแห้น้!งที่�%เคอร้*เซอร้*ว็างอย !

การ้แที่ร้กห้ลายแถว็/คอล�มืน้* Table>Insert Row or Column


การีลิบแถวแลิะคอลิ�มน� เลิ�อกแถวที่��ต์�องการีจ็ะลิบแลิ�วกดปุ่ม <Delete> การีรีวมแลิะการีแบ'งเซลิลิ� เลิ�อกเซลิลิ�ที่��ต์�องการีรีวม(ต์�องเปุ่/นเซลิลิ�ที่��ต์�ดก�น) โดยกดค�ย� <Ctrl> พื่รี�อมก�บเลิ�อกเซลิลิ� คลิ�กเมาส์� ปุ่ม จ็ากหน�าต์'าง Properties หรี�อคลิ�กเมาส์�ขวาเลิ�อกค�าส์��ง Table<Merge Cells

การีแบ'งเซลิลิ� คลิ�กปุ่ม หรี�อ คลิ�กเมาส์�ขวาเลิ�อกเมน� Table<Split Cell (หรี�อเลิ�อก Modify>Table>Split Cell ที่��เมน�


การ้พ$มืพ*ขอคว็ามืลงใน้ตาร้างเร้าสามืาร้ถพ$มืพ*ขอคว็ามืเขาไปใน้ตาร้างที่�%สร้างได้โด้ยคล$ก เล�อกช้!องที่�%ตอง แลว็พ$มืพ*ขอคว็ามืที่�%ตองการ้ลงไปได้เลย

การ้แที่ร้กร้ ปภาพใน้ตาร้างสามืาร้ถแที่ร้กร้ ปภาพเขามืาใน้ตาร้าง และที่.าการ้เช้�%อมืโยงร้ ปน้�+น้ไปย�งไฟล*อ�%น้ๆ ได้ด้�งน้�+1. คล$กเล�อกต.าแห้น้!งใน้เซลล*ที่�%ตองแที่ร้กร้ ปภาพ2. เล�อก Insert>Image ห้ร้�อ คล$กป01มื ที่�%ห้น้าต!างอ�อบเจั�กต*3. เล�อกร้ ปภาพที่�%ตองการ้ แลว็คล$กเมืาส*ป01มื4. ก.าห้น้ด้ค!าต!างๆ ของภาพเช้!น้ ขอบภาพ ต.าแห้น้!งของภาพก�บขอคว็ามื ต.าแห้น้!งของภาพใน้ช้!องตาร้าง ขน้าด้ของภาพ การ้ล$งค*ภาพ ได้ที่�%แถบ Properties


การ้ใส!ขอบใส!ส�ตาร้างBrdr รีะบส์�เส์�นขอบของต์ารีาง

Bg Color รีะบส์�พื่�1นต์ารีางแลิะส์�ขอบของต์ารีาง

Bg Image รีะบภาพื่ที่��จ็ะใช้�เปุ่/นพื่�1นหลิ�งของต์ารีาง แลิะส์�ขอบของต์ารีาง


การ้จั�ด้เร้�ยงขอคว็ามืใน้ตาร้างจ็�ดข�อม�ลิในแนวนอน ส์ามารีถจ็�ดข�อม�ลิที่��แส์ดงในช้'องต์ารีางให�ช้�ดขวา ช้�ดซ�าย หรี�ออย�'ก2�งกลิางของช้'องต์ารีางโดยการีคลิ�ก ช้'องต์ารีางที่��ต์�องจ็�ดข�อม�ลิ แลิ�วก�าหนดต์�าแหน'งของข�อม�ลิในช้'อง Horz ในแถบ Properties Default เปุ่/นการีจ็�ดเรี�ยงข�อม�ลิแบบปุ่กต์�Left จ็�ดให�ข�อม�ลิอย�'ช้�ดซ�ายของช้'องต์ารีางRight จ็�ดให�ข�อม�ลิอย�'ช้�ดขวาของช้'องต์ารีางCenter จ็�ดให�ข�อม�ลิอย�'ก��งกลิางของช้'องต์ารีาง


จ็�ดข�อม�ลิในแนวต์�1งถ�าม�ช้'องต์ารีางที่��ขยายออกมากกว'า 1 แถว ส์ามารีถก�าหนดข�อม�ลิในต์ารีางช้'องน�1นให�อย�'ช้�ดบน ช้�ดลิ'าง หรี�ออย�'ก2�งกลิาง โดยการีคลิ�กช้'องต์ารีางที่��ต์�องจ็�ดการีข�อม�ลิ แลิ�วก�าหนดต์�าแหน'งของข�อม�ลิช้'อง Vert ซ2�งอย�'ในหน�าต์'าง PropertiesDefault เปุ่/นการีจ็�ดเรี�ยงแบบปุ่กต์�ของข�อม�ลิ(ค�อจ็�ดให�อย�'ก2�งกลิางของช้'วงต์ารีาง)Top จ็�ดให�ข�อม�ลิอย�'บนส์ดของช้'องต์ารีาง Middle จ็�ดให�ข�อม�ลิอย�'ก2�งกลิางของช้'องต์ารีาง Bottom จ็�ดให�ข�อม�ลิอย�'ลิ'างส์ดของช้'องต์ารีางBaseline ข�อม�ลิบรีรีที่�ดส์ดที่�ายจ็ะต์�ดก�บขอบเซลิลิ�เส์�นลิ'างส์ด

ร้ ปแบบของจั0ด้เช้�%อมืโยง

การีเช้��องโยงบนเว!บเพื่!จ็ม�ด�วยก�นหลิายรี�ปุ่แบบ อาจ็แบ'งต์ามการีใช้�งาน หรี�อต์ามลิ�กษณะการีเช้��องโยงจ็ะแบ'งการีเช้��อมโยงออกเปุ่/น 2 ปุ่รีะเภที่ ค�อ การีเช้��อมโยงภายในเว!บเพื่!จ็ แลิะการีเช้��อมโยงภายนอกเว!บเพื่!จ็ แต์'ถ�าแบ'งต์ามว�ต์ถปุ่รีะส์งค�ของรี�ปุ่แบบการีใช้�งานจ็ะแบ'งการีเช้��อมโยงบนเว!บเพื่!จ็ออกเปุ่/นปุ่รีะเภที่ต์'าง ๆ ด�งต์'อไปุ่น�1การีเช้��อมโยงภายในเว!บเพื่!จ็เด�ยวก�น การีเช้��อมโยงภายในเว!บไซต์�เด�ยวก�น การีเช้��อมโยงไปุ่ย�งเว!บไซต์�อ��น การีเช้��อมโยงไปุ่ย�งไฟลิ�ดาวน�โหลิด การีเช้��อมโยงด�วยอ�เมลิ� การีเช้��อมโยงด�วยแมบลิ�งค� การีเช้��อมโยงด�วย RollOver Image


เช้�%อมืโยงภายใน้เว็�บเพ�จัเด้�ยว็ก�น้การีเช้��อมโยงภายในเว!บเพื่!จ็เด�ยวก�น หากข�อม�ลิในหน�าเว!บเพื่!จ็เด�ยวก�นม�ขนาดยาวมาก ที่�าให�ต์�องใช้� Scrollbar เลิ��อนด� เรีาส์ามารีถเช้��อมโยงข�อม�ลิภายในเพื่!จ็เด�ยวก�นได�โดย click mouse ต์�าแหน'งที่��เปุ่/น Link จ็ะกรีะโดด ไปุ่ย�งข�อม�ลิส์'วนอ��นซ2�งอย�'ในเพื่!จ็เด�ยวก�น ด�งน�1

ร้ ปแบบของจั0ด้เช้�%อมืโยง1. ก�าหนดจ็ด Anchor หรี�อที่�� Link จ็ะกรีะโดดไปุ่ในหน�าเว!บเพื่!จ็น�1น2. Click mouse ปุ่ม ในแถบอ!อบเจ็!กต์�หรี�อเลิ�อกจ็ากเมน� Insert>Named Anchor หรี�อ กดปุ่ม <Ctrl+Alt+A>3. ต์�1งช้��อจ็ด Anchor จ็ากหน�าจ็อย'อยที่��ปุ่รีากฏข21น ด�งต์�วอย'างเรีาต์�1งช้��อว'า Programming แลิ�ว คลิ�กปุ่ม 4. รีะบข�อความที่��เรีาต์�องการีจ็ะเช้��อมโยงไปุ่ย�งจ็ด Anchor โดยรีะบายแถบส์�ที่��ข�อความน�1น5. ก�าหนดการี Link โดยการีพื่�มพื่� # ต์ามด�วยช้��อจ็ด Anchor ที่��เรีาได�ต์�1งไว�ในข�อ 3 ในช้'อง Link จ็ากหน�าต์'าง Properties แลิ�วเคาะ Enter6. เซฟแลิ�วต์รีวจ็ส์อบการี Link จ็ากบรีาวเซอรี�นอกจ็ากน�1แลิ�วเรีาส์ามารีถที่�าจ็ดย�อนกลิ�บจ็ากด�านลิ'างของหน�าเว!บเพื่!จ็ไปุ่ย�งส์'วนบนส์ดได� ซ2�งว�ธี�การีที่�าเช้'นเด�ยวก�บ ข�อ 1-5 แต์'เปุ่ลิ��ยนจ็ด Anchor อย�'ด�านบนของหน�าเว!บเพื่!จ็ แลิะจ็ดที่��จ็ะ Link อย�'ด�านลิ'างของเพื่!จ็ ด�งต์�วอย'าง

ร้ ปแบบของจั0ด้เช้�%อมืโยงเช้�%อมืโยงภายใน้เว็�บไซต*เด้�ยว็ก�น้การีเช้��อมโยงภายในเว!บไซต์�เด�ยวก�น1. พื่�มพื่�ข�อความลิงไปุ่บนเว!บเพื่!จ็2. คลิ�กปุ่ม เพื่��อก�าหนดไฟลิ�ที่��จ็ะเช้��อมโยงถ�าเรีารี� �ต์�าแหน'งของไฟลิ�ที่��จ็ะเช้��อมโยงก!ส์ามารีถพื่�มพื่�ต์�าแหน'งเก!บไฟลิ�เว!บเพื่!จ็ที่��ต์�องการีเช้��อมโยงในช้'อง Link ได�เลิย3. เลิ�อกไฟลิ�ที่��ต์�องการีจ็ะเช้��อมโยง4. คลิ�กปุ่ม OK5. เซฟหน�าเว!บเพื่!จ็แลิ�วเปุ่8ดบรีาวเซอรี�เพื่��อที่ดส์อบการีเช้��อมโยงจ็ะเห!นว'าเม��อคลิ�กที่��ข�อความจ็ะปุ่รีากฏเว!บเพื่!จ็ที่��ได�เช้��อมโยงไปุ่


เช้�%อมืโยงไปย�งเว็�บไซต*อ�%น้การีเช้��อมโยงไปุ่เว!บไซต์�อ��นในการีเช้��อมโยงก�บเว!บไซต์�อ��น ให�เรีารีะบ URL ของเว!บเพื่!จ็น�1น โดยให�พื่�มพื่� http:// น�าหน�าช้��อของเว!บเพื่!จ็ที่��เรีาต์�องการีเช้��อมโยงด�วยที่กครี�1ง ขอแนะน�าให�ที่�าการีต์รีวจ็ส์อบ URL ปุ่ลิายที่างที่��เรีาต์�องการีเช้��อมโยงด�วยว'าเปุ่/นเว!บไซต์�ที่��ถ�กต์�อง เน��องจ็ากเน�1อหาในเว!บม�กม�การีเปุ่ลิ��ยนแปุ่ลิงอย�'เส์มอ1. ที่�าการีแดรีกเมาส์�ที่��ข�อความที่��ต์�องการีลิ�งค�2. พื่�มพื่�ช้��อเว!บไซต์�ที่��ต์�องการีลิ�งค� ที่�� Properties ในช้'อง Link


เช้��อมโยงด�วยแฟ9มข�อม�ลินอกจ็ากเรีาส์ามารีถส์รี�างต์�วเช้��อมโยงจ็ากเว!บเพื่!จ็ไปุ่ย�งเว!บเพื่!จ็หรี�อจ็ากเว!บเพื่!จ็ไปุ่ย�งเว!บไซต์�แลิ�ว เรีาย�งส์ามารีถส์รี�างการีเช้��อมโยงไปุ่ที่��แฟ9มข�อม�ลิปุ่รีะเภที่ใดๆก!ได� เช้'น แฟ9มเอกส์ารีที่��วไปุ่ , แฟ9มรี�ปุ่ภาพื่ หรี�อแฟ9มอ��นๆได�ต์ามความปุ่รีะส์งค�ของเรีา โดยม�ข�1นต์อน ด�งน�11. เลิ�อกข�อความที่��จ็ะที่�าเปุ่/นลิ�งค�เพื่��อเช้��อมโยงแฟ9มข�อม�ลิ 2. ที่��แถบ Properties พื่�มพื่�ที่��อย�'ขอแฟ9มข�อม�ลิ หรี�อ คลิ�กที่�� เลิ�อกแฟ9มข�อม�ลิที่��ต์�องการี3. หลิ�งจ็ากเลิ�อกแฟ9มข�อม�ลิที่��ต์�องการี ปุ่รีากฏ ด�งรี�ปุ่


เช้�%อมืโยงด้ว็ยอ�เมืล*การีเช้��อมโยงด�วยอ�เมลิ�โดยปุ่กต์� เพื่��อให�ผู้��ที่��มาเย��ยมช้มเว!บเพื่!จ็ของเรีาส์ามารีถต์�ดต์'อเรีาได� จ็ะม�การีส์รี�าง Link ช้�1ไปุ่ย�งอ�เมลิ�แอดเดรีส์ของเรีา เม��อผู้��ใช้�คลิ�กที่�� Link น�1ก!จ็ะส์ามารีถเข�ยนอ�เมลิ�มาคยก�บเรีาได� โดยไม'ต์�องเส์�ยเวลิาพื่�มพื่�อ�เมลิ�แอดเดรีส์ของเรีา1. พื่�มพื่�ข�อความที่��ต์�องการีลิงเว!บเพื่!จ็2. คลิ�กที่��ข�อความที่��ต์�องการีเช้��อมโยง พื่�มพื่�อ�เมลิ�แอดเดรีส์ที่��ช้'อง Link โดยม�ค�าว'า mailto: ต์ามด�วยช้��อเมลิ�ที่��ต์�องการีให�ส์'ง แลิ�วเคาะ Enter ต์�วอย'าง 3. บ�นที่2กแลิ�วที่ดส์อบการีเช้��อมโยงผู้'านบรีาวเซอรี� ด�วยการีกด F12 4. เม��อคลิ�กที่��ข�อความ จ็ะปุ่รีากฏโปุ่รีแกรีมส์'งเมลิ� โดยจ็ะม�อ�เมลิ�แอดเดรีส์แส์ดงข21นมาให�เรี�ยบรี�อย


เช้�%อมืโยงด้ว็ยแมืบล$งค*การีเช้��อมโยงด�วยแมบลิ�งค� การีเช้��อมโยงด�วย map link ค�อ การีก�าหนดขอบเขต์การีลิ�งค�บนภาพื่กรีาฟ8กขนาดใหญ่' ซ2�งเรีาส์ามารีถก�าหนดพื่�1นที่��การีลิ�งค�ก�บภาพื่ที่��เปุ่/นรี�ปุ่ส์��เหลิ��ยม วงกลิม หรี�อรี�ปุ่หลิายเหลิ��ยมก!ได� เม��อเรีาคลิ�กที่��ส์'วนต์'างๆของภาพื่ที่��ที่�าแมบลิ�งค� จ็ะส์ามารีถเช้��อมโยงไปุ่ย�งหน�าเว!บอ��นๆ ต์'อไปุ่ โดยม�ข�1นต์อน ด�งต์'อไปุ่น�1 1. เลิ�อกรี�ปุ่ที่��ต์�องการีจ็ะที่�าแมบลิ�งค�2. เลิ�อกเครี��องม�อที่��จ็ะก�าหนดบรี�เวณแมบลิ�งค� ที่��ต์�องการี (Hotspot) ต์ามรี�ปุ่แบบที่��ต์�องการี ส์�าหรี�บเลิ�อก บรี�เวณ Hotspot เม��อต์�องการีย�ายต์�าแหน'งส์�าหรี�บก�าหนดช้��อให� Hotspot

ส์�าหรี�บก�าหนดขอบเขต์ Hotspot เปุ่/นรี�ปุ่ส์��เหลิ��ยมส์�าหรี�บก�าหนดขอบเขต์ Hotspot เปุ่/นรี�ปุ่วงกลิมส์�าหรี�บก�าหนดขอบเขต์ Hotspot เปุ่/นรี�ปุ่เหลิ��ยมใดๆ


3. คลิ�กวาดรี�ปุ่บรี�เวณที่��ต์�องการี ด�งรี�ปุ่ 4. ก�าหนดค'าพื่�1นฐานของ Hotspot ด�งน�1Link : เพื่!จ็ที่��ต์�องการีลิ�งค�ไปุ่ โดยคลิ�ก เพื่��อเลิ�อก Target : ก�าหนดรี�ปุ่แบบการีเปุ่8ดเว!บเพื่!จ็_blank : แส์ดงโดยเปุ่8ดบรีาวเซอรี�ใหม'_parent : เช้��อมโยงในบรีาวเซอรี�เด�ม_self : เปุ่8ดในเฟรีมเด�ม_top : เปุ่8ดในเฟรีมเด�มโดยแส์ดงเต์!มเฟรีมAlt : ช้��อของบรี�เวณที่��ส์รี�าง Hotspot


เช้�%อมืโยงด้ว็ย RollOver Imageการีเช้��อมโยงด�วย RollOver Image เปุ่/นการีส์รี�างลิ�กเลิ'นให�ก�บภาพื่บน

หน�าเว!บเพื่!จ็ให�น'าใช้�มากย��งข21น โดยเม��อน�าเมาส์�มาวางที่��รี�ปุ่ภาพื่ รี�ปุ่ภาพื่จ็ะเปุ่ลิ��ยนไปุ่เปุ่/นอ�กรี�ปุ่หน2�ง แลิะเม��อคลิ�กลิงที่��รี�ปุ่ภาพื่ ก!จ็ะส์ามารีถเช้��อมโยงไปุ่ย�งเว!บเพื่!จ็หรี�อรี�ปุ่ภาพื่ต์'างๆได� โดยม�ข�1นต์อนต์'อไปุ่น�1

1 . เลิ�อกบรี�เวณที่��จ็ะที่�า RollOver Image2. คลิ�กที่�� แถบเครี��องม�อ หรี�อคลิ�กเมน� Image>Image

objects 3. เลิ�อก RollOver Image4. ก�าหนดรีายลิะเอ�ยดต์'างๆ แลิ�วกดปุ่ม OK แลิ�วกด F12 ที่ดส์อบ

ร้ ปแบบของเฟร้มื

ร้ ปแบบของเฟร้มืการีส์รี�างเฟรีมในเว!บเพื่!จ็ การีใช้�เฟรีมเซต์ (Frame Set) เปุ่/นรี�ปุ่แบบหน2�งของการีน�าเส์นอผู้ลิงานผู้'านหน�าเว!บเพื่!จ็ ออกเปุ่/นส์'วนย'อย ที่��เรี�ยกว'า เฟรีม ที่�าให�เรีาส์ามารีถใช้�พื่�1นที่��ที่� 1งหมดบนหน�าจ็อได�อย'างม�ปุ่รีะส์�ที่ธี�ภาพื่ โดยแต์'ลิะเฟรีมน�1นจ็ะแส์ดงหน�าเว!บที่��แต์กต์'างก�น เช้'น ก�าหนดส์'วนบนส์ด (topFrame) แส์ดงช้��อโลิโกของเว!บไซต์� หน�าจ็อด�านซ�าย (leftFrame) แส์ดงข�อความต์'างๆ เพื่��อเปุ่8ดด�เว!บเพื่!จ็หน�าอ��นๆ หรี�อส์'วนด�านขวา (mainFrame) แส์ดงเน�1อหาที่��เก�ดจ็ากการีคลิ�กในส์'วน leftFrame แต์'ลิะเฟรีม จ็ะแส์ดงเว!บเพื่!จ็ที่��แต์กต์'างก�นข�อด� ค�อ ส์�าหรี�บจ็�ดแบ'งพื่�1นที่��บนหน�าเว!บเพื่!จ็ออกเปุ่/นส์'วนๆ ให�เปุ่/นอ�ส์รีะต์'อก�น โดยส์ามารีถจ็�ดแบ'งเฟรีมได�ที่�1งในแนวต์�1งแลิะแนวนอน เม��อน�าไปุ่แส์ดงผู้ลิบนบรีาวเซอรี�ข�อม�ลิที่��ปุ่รีากฏข21นมาก!จ็ะถ�กจ็�ดแบ'งออกเปุ่/นส์�ดส์'วนอย'างช้�ดเจ็นข�อเส์�ย ค�อ กรีณ�ที่��ผู้��ใช้�จ็ะบ�นที่2กเว!บเพื่!จ็ที่��ช้��นช้อบแลิะเข�าบ'อยครี�1ง (Favorites) อาจ็จ็ะอ�างอ�งเว!บเพื่!จ็ไม'ต์รีงต์ามความต์�องการีได�ส!ว็น้ปร้ะกอบของเฟร้มื

ร้ ปแบบของเฟร้มื ส!ว็น้ปร้ะกอบของเฟร้มื1 . เฟรีมหลิ�ก (Frameset) ค�อ

หน�าต์'างเฟรีมที่��ใหญ่'ที่��ส์ด ที่��คอยควบคมเฟรีมย'อยอ��นๆ โดยที่��หน�าต์'างเฟรีมที่��ก�าหนดลิ�กษณะการีแบ'งเฟรีมในแนวต์�1งแลิะแนวนอน แลิะส์ามารีถก�าหนดค'าคณส์มบ�ต์� ขนาด ส์�ของเส์�นของ รีะยะห'างรีะหว'างเฟรีมได�ต์ามต์�องการี

2. เฟรีมย'อย (Frame) ค�อ หน�าต์'างเฟรีมที่��ก�าหนดช้��อของเฟรีมแต์'ลิะเฟรีม โดยส์ามารีถก�าหนดไฟลิ�เว!บเพื่!จ็หรี�อเว!บไซต์�ที่��แส์ดงปุ่รีะจ็�าเฟรีมเว!บเพื่!จ็ได�อย'างอ�ส์รีะ

ต์�วอย'าง เฟรีมย'อย (Frame)topFrame ค�อ เฟรีมด�านบนleftFrame ค�อ เฟรีมด�านซ�ายmainFrame ค�อ เฟรีมข�อม�ลิต์รีงกลิาง

ร้ ปแบบของเฟร้มื ข�1นต์อนการีออกแบบเฟรีมคลิ�กที่��แที่!บค�าส์��ง Frame บนแถบเครี��องม�อ Insertที่��แที่!บ Characters จ็ะปุ่รีากฏรี�ปุ่แบบของเฟรีมข21นมาให�เลิ�อกใช้�งานมากมายถ2ง 13 แบบ โดยเม��อได�ส์รี�างเฟรีมที่��ต์�องการีข21นมาแลิ�ว ภายในย�งส์ามารีถส์รี�างเฟรีมในรี�ปุ่แบบต์'างๆ เพื่��มเต์�มได�อ�ก ปุ่มเครี��องม�อ ช้��อปุ่มเครี��องม�อ หน�าที่��การีที่�างาน 1. Left Frame ส์รี�างเฟรีมข21นมา 2 ส์'วน ค�อ ด�านซ�ายแส์ดงเมน� แลิะด�านขวาแส์ดงเน�1อหา 2. Right Frame ส์รี�างเฟรีมข21นมา 2 ส์'วน ค�อ ด�านขวาแส์ดงเมน� แลิะด�านซ�ายแส์ดงเน�1อหา 3. Top Frame ส์รี�างเฟรีมข21นมา 2 ส์'วน ค�อ ด�านบนเมน� แลิะด�านลิ'างแส์ดงเน�1อหา 4. Bottom Frame ส์รี�างเฟรีมข21นมา 2 ส์'วน ค�อ ด�านบนแส์ดงเน�1อหา แลิะด�านลิ'างแส์ดงเมน� 5. Bottom and Nested Left Frame ส์รี�างเฟรีมข21นมา 3 ส์'วน ค�อ ด�านซ�าย ขวา แลิะลิ'าง


ปุ่มเครี��องม�อ ช้��อปุ่มเครี��องม�อ หน�าที่��การีที่�างาน 6. Bottom and Nested Right Frameส์รี�างเฟรีมข21นมา 3 ส์'วน ค�อ ด�านซ�าย ขวา แลิะลิ'าง 7. Left and Nested Bottom Frame ส์รี�างเฟรีมข21นมา 3 ส์'วน ค�อ ด�านซ�าย ขวา แลิะลิ'าง 8. Right and Nested Bottom Frameส์รี�างเฟรีมข21นมา 3 ส์'วน ค�อ ด�านซ�าย ขวา แลิะลิ'าง 9. Top and Bottom Frame ส์รี�างเฟรีมข21นมา 3 ส์'วน ค�อ ด�านบน กลิาง แลิะด�านลิ'าง


ปุ่มเครี��องม�อ ช้��อปุ่มเครี��องม�อ หน�าที่��การีที่�างาน 10. Left and Nested Top Frame ส์รี�างเฟรีมข21นมา 3 ส์'วน ค�อ ด�านซ�าย ขวา แลิะลิ'าง11. Right and Nested Top Frame ส์รี�างเฟรีมข21นมา 3 ส์'วน ค�อ ด�านซ�าย ขวา แลิะลิ'าง12. Top and Nested Left Frame ส์รี�างเฟรีมข21นมา 3 ส์'วน ค�อ ด�านซ�าย ขวา แลิะลิ'าง13. Top and Nested Right Frame ส์รี�างเฟรีมข21นมา 3 ส์'วน ค�อ ด�านซ�าย ขวา แลิะลิ'าง


การ้สร้างและปร้�บแต!งเฟร้มืข�1นต์อนการีส์รี�างเว!บเพื่!จ็แบบแบ'งเฟรีม1. คลิ�กที่��แที่!บค�าส์��ง Frame บนแถบเครี��องม�อ Insert2. คลิ�กปุ่ม Top and Nested Left Frame ที่��แที่!บ Frames จ็ะปุ่รีากฏเฟรีมข21นมาที่างด�านบนแลิะด�านซ�ายของพื่�1นงาน ซ2�งส์ามารีถแดรีกเมาส์�ที่�าการีย'อขยายขนาดของเฟรีมได�ต์ามต์�องการี


ค�าอธี�บาย Frame Properties Frame ช้��อแที่นต์�าแหน'งเฟรีมย'อย Src ต์�าแหน'งที่��เฟรีมอ�างอ�งก�บเว!บเพื่!จ็ (ควรีต์�1งช้��อให�ส์อดคลิ�องก�บช้��อเฟรีม) Scroll ก�าหนดให�เฟรีมย'อยส์ามารีถเลิ��อนหน�าได�หรี�อไม' ถ�าเว!บเพื่!จ็ม�ขนาดใหญ่'เก�นเฟรีมย'อย No Resize ก�าหนดให�ส์ามารีถปุ่รี�บลิด ขยายเฟรีมย'อยได�หรี�อไม' (คลิ�ก ค�อ ไม') Borders ก�าหนดให�เส์�นเฟรีมแรีเงาหรี�อไม' Border Color ก�าหนดส์�ขอบเฟรีม MarginWidth : ความกว�างจ็ากขอบเฟรีม , Height : ความส์�งจ็ากขอบเฟรีม

ร้ ปแบบของเฟร้มื การ้บ�น้ที่3กเฟร้มืเน��องจ็ากเฟรีมที่�างานในลิ�กษณะแส์ดงหลิายเพื่!จ็ในหน�าเด�ยวก�น ฉะน�1นการีบ�นที่2ก (save) จ็ะบ�นที่2ก ด�งน�1กรีณ�ที่�� 1 1. คลิ�กเฟรีมย'อยที่��ต์�องการี2. คลิ�ก File >> Save Frame as ...3. ก�าหนดช้��อเพื่!จ็ในแต์'ลิะเฟรีมที่��เลิ�อก กด Save

กรีณ�ที่�� 21. คลิ�ก File >> Save All (ส์�งเกต์จ็ะช้�1ที่��เฟรีมย'อยแต์'ลิะเฟรีม ในครี�1งแรีกโปุ่รีแกรีมจ็ะบ�นที่2กไปุ่ที่�ลิะเฟรีม เรี��มจ็าก Frameset แลิะFrame อ��นๆไปุ่เรี��อยๆ )2. ก�าหนดช้��อเพื่!จ็ในแต์'ลิะเฟรีมที่��เลิ�อก กด Save การีปุ่รี�บแต์'งเฟรีม การีแบ'งหน�าจ็อการีที่�างานเปุ่/นลิ�กษณะเฟรีม ควรีก�าหนดคณส์มบ�ต์�ต์'างๆ (Properties) ด�งน�11. คลิ�กที่��เส์�นแบ'งเฟรีม จ็ะปุ่รีากฏลิ�กศรี 2 ที่�ศที่าง2. ปุ่รีากฏกรีอบคณส์มบ�ต์�ของเฟรีม ด�งรี�ปุ่ (แนะน�าให�เปุ่8ด Panel ของเฟรีมควบค�'ด�วย Windows >> Others >> Frames )


ค�าอธี�บาย Frame Properties Frame Set แส์ดงรีายลิะเอ�ยดของเฟรีมเซต์ ปุ่รีะกอบด�วย 2 Rows แลิะ 1 Cols Borders ก�าหนดให�เส์�นเฟรีมแรีเงาหรี�อไม' (ค'าหลิ�ก ค�อ ไม') Border Color ก�าหนดส์�ขอบเฟรีม ก�าหนดค'าความส์�งหรี�อความกว�าง (Value) ของเฟรีม : หน'วย (Units) เปุ่/น Pixels , Percent , Relative * Row กรีณ�เลิ�อก Frameset จ็ะก�าหนดความส์�งของเฟรีมด�านบน (topFrame) * Column กรีณ�เลิ�อก Frame ย'อย จ็ะก�าหนดความกว�างของเฟรีมด�านย'อย (leftFrame)นอกจ็ากการีก�าหนดคว�าง ความส์�งของเฟรีมย'อย ใน Frame Properties แลิ�ว เรีาส์ามารีถก�าหนดโดยการีลิากเมาส์� ก�าหนดได�ด�งน�1


การ้ลบเฟร้มืคลิ�กเมาส์�ที่��เส์�นแบ'งเฟรีมที่��ต์�องการีลิบ แลิ�วลิากเมาส์�ข21นช้�ดขอบบนส์ด (ลิบเฟรีมด�านบน) หรี�อลิากเมาส์�ไปุ่ช้�ดขอบด�านซ�าย (ลิบเฟรีมคอลิ�มภ�)


การ้เช้�%อมืโยงภายใน้เฟร้มืการีเช้��อมโยงภายในเฟรีมเม��อเรีาแบ'งหน�าจ็อออกเปุ่/นเฟรีม การีก�าหนดการีเช้��อมโยง เพื่��อเช้��อมต์'อก�บเว!บเพื่!จ็อ��นๆ ต์�องรีะบเฟรีมที่��จ็ะให�เก�ดการีเปุ่ลิ��ยนแปุ่ลิง เช้'น ถ�าเรีาต์�องการีคลิ�กลิ�งค�ด�านซ�าย (leftFrame) แลิะให�ผู้ลิการีลิ�งค�แส์ดงใน เฟรีมหลิ�ก (mainFrame) ส์ามารีถที่�าต์ามข�1นต์อน ด�งน�1 1. เลิ�อกข�อความที่��ต์�องการีก�าหนดเปุ่/น ลิ�งค�เช้��อมโยง2. คลิ�กที่��ปุ่ม เพื่��อเลิ�อกแฟ9มที่��ต์�องการีเช้��อมโยงด�วย ในแถบ Properties3. เม��อเลิ�อกแฟ9มที่��ต์�องการีแลิ�ว คลิ�กปุ่ม OK 4. ก�าหนดรี�ปุ่แบบการีแส์ดงผู้ลิจ็ากช้'อง Target


4. ก�าหนดรี�ปุ่แบบการีแส์ดงผู้ลิจ็ากช้'อง TargetTarget : ก�าหนรี�ปุ่แบบการีเปุ่8ดเว!บเพื่!จ็_blank : แส์ดงโดยเปุ่8ดบรีาวเซอรี�ใหม'_parent : เช้��อมโยงในบรีาวเซอรี�เด�ม_self : เปุ่8ดในเฟรีมเด�มรี�ปุ่แบบที่��เพื่��มมาจ็ากการีเช้��อมโยงปุ่กต์� mainframe : แส์ดงที่��เฟรีม ช้��อ mainframetop Frame : แส์ดงที่��เฟรีม ช้��อ top Frameleft Frame : แส์ดงที่��เฟรีม ช้��อ left Frame

คว็ามืร้ เร้�%องเลเยอร้*

คว็ามืร้ เร้�%องเลเยอร้*เลิเยอรี� (Layer)เปุ่/นเครี��องม�อที่��จ็�าเปุ่/นส์�าหรี�บการีส์รี�างเว!บเพื่!จ็เพื่��อช้'วยในการีจ็�ดต์�าแหน'งหน�าเว!บเพื่!จ็ โดยม�ลิ�กษณะเปุ่/นอ�ส์รีะต์'อก�นเปุ่รี�ยบเส์ม�อนแผู้'นใส์ที่��ใช้�ในงานน�าเส์นอข�อม�ลิที่��น�ามาซ�อนก�น ที่�าให�เรีาส์ามารีถมองเห!นที่ะลิ เห!นข�อม�ลิในแผู้'นอ��นๆ ได�การีส์รี�างเลิเยอรี� (Layer) ที่�าได� 2 ว�ธี�ด�งน�11. ถ�าต์�องการีวาดเลิเยอรี�ให� คลิ�กที่��ไอคอน Draw Layer ในแถบเครี��องม�อ Insert หลิ�งจ็ากที่��คลิ�ก แลิ�วเมาส์�พื่อยต์�เต์อรี�จ็ะเปุ่ลิ��ยนเปุ่/นรี�ปุ่ + ให�คลิ�กลิากเมาส์�พื่อยต์�เต์อรี�เพื่��อส์รี�างพื่�1นที่��ของเลิเยอรี�ใน Document Window คลิ�ก + วาดรี�ปุ่เลิเยอรี�


2. ถ�าต์�องการีเพื่��มเลิเยอรี�โดยไม'วาดให�เลิ�อกที่��ค�าส์��ง Insert -> Layerผู้ลิการีส์รี�างเลิเยอรี�

ความแต์กต์'างรีะหว'าง การีส์รี�างเลิเยอรี� โดยการี Draw Layer แลิะการีเรี�ยกใช้�เมน� ค�อ การีส์รี�างจ็ากเมน� จ็ะม�ส์�ดส์'วนเลิเยอรี�ที่��คงที่��ส์'วนปุ่รีะกอบของเลิเยอรี� (Layer)1. ห�เลิเยอรี� : ส์�าหรี�บด2งย�ายต์�าแหน'งไปุ่ ณ ต์�าแหน'งที่��ต์�องการี2. จ็ดปุ่รี�บขนาด (Handle)ปุ่รีะกอบด�วย จ็ดส์�ด�า 8 จ็ด ไว�ใช้�ในการีปุ่รี�บขนาดเลิเยอรี�


การีปุ่รี�บขนาดเลิเยอรี� ที่�าได� 2 ว�ธี� ด�งน�1คลิ�กที่��ขอบด�านใดด�านหน2�งของเลิเยอรี�จ็ะปุ่รีากฎ Resize Handle ลิ�อมรีอบเลิเยอรี� หลิ�งจ็ากน�1นในคลิ�กลิาก Handle เพื่��อปุ่รี�บขนาดของเลิเยอรี�ต์ามต์�องการีหรี�อ คลิ�กพื่�1นที่��ที่��อย�'เลิเยอรี�แลิ�วพื่�มพื่�ค'าความกว�างในช้'อง Width แลิะ ความส์�งในช้'อง Height ใน Property Inspector


การ้เปล�%ยน้ต.าแห้น้!งของเลเยอร้*ต์�าแหน'งของเลิเยอรี�จ็ะอ�างอ�งก�บเว!บเพื่!จ็เลิเยอรี�ห'างจ็ากด�านบนแลิะด�านซ�ายของเว!บเพื่!จ็เปุ่/นจ็�านวนเที่'าไรี ส์ามารีถที่�าได�หลิายว�ธี� ด�งน�1คลิ�กลิาก Selection Handle ที่��ต์�องการีเปุ่ลิ��ยนต์�าแหน'งไปุ่ย�งต์�าแหน'งที่��ต์�องการีใน Document Windowหรี�อ คลิ�กพื่�1นที่��ที่��อย�'ในเลิเยอรี�แลิ�วพื่�มพื่�รีะยะห'างจ็ากด�านบนในช้'อง T แลิะรีะยะห'างจ็ากด�านซ�ายในช้'อง L ใน Property Inspector


การ้เพ$%มืเน้�+อห้าลงใน้เลเยอร้*การีเพื่��มเน�1อหาลิงในเลิเยอรี�ที่�าได�เช้'นเด�ยวก�บที่��เรีาเพื่��มเน�1อหาลิงในเว!บเพื่!จ็ ซ2�งม�ข� 1นต์อน ด�งน�11. คลิ�กพื่�1นที่��ที่��อย�'ในเลิเยอรี�ที่��ต์�องการีเพื่��มเน�1อหา2. พื่�มพื่�ข�อความ เพื่��มรี�ปุ่ภาพื่หรี�อ ว�ต์ถที่��ต์�องการีลิงในเลิเยอรี�


ลบเลเยอร้* เม��อใดที่��ต์�องการีลิบเลิเยอรี� ให�คลิ�กเลิ�อกเลิเยอรี�แลิะกดค�ย� Del ที่��แปุ่9นค�ย�บอรี�ดการ้แปลงเลเยอร้*เป7น้ตาร้างคลิ�กเลิ�อกเลิเยอรี�ที่��ต์�องการี แลิ�วคลิ�กเมน� Modify > Convert > Layers to Tables...การ้แปลงตาร้างเป7น้เลเยอร้*คลิ�กเลิ�อกต์ารีางที่��ต์�องการี แลิ�วคลิ�กเมน� Modify > Convert > Tables to Layers

คว็ามืร้ เร้�%องอ�%น้ + ล กเล!น้ต!าง การ้สร้างเมืน้ ย!อย Behaviors1 . ใช้เมืาส*คล$กภาพห้ร้�อขอคว็ามืที่�%

ตองการ้สร้างเมืน้ ย!อย2. ที่.าล$งค*ให้ก�บภาพห้ร้�อขอคว็ามื3 . เล�อก Behaviors4 . ใช้เมืาส*ช้�+ที่�% เคร้�%องห้มืาย +-5 . เล�อก Show Pup-Up menu6 . จัะได้ห้น้าต!าง Show Pup-Up

menu7. ช้!อง Title พ$มืพ*ห้�ว็ขอเมืน้ ย!อย8. เล�อกเมืน้ Appearance เล�อกร้ ป

แบบ เล�อกแบบต�ว็อ�กษร้9. Advanced ใส!ร้ายละเอ�ยด้ให้ก�บต�ว็

Pup-up Menu1 0 .เล�อกเมืน้ Position เล�อก

ต.าแห้น้!งที่�%จัะโช้ว็*เมืน้

คว็ามืร้ เร้�%องอ�%น้ + ล กเล!น้ต!าง การ้สร้างเมืน้ ย!อย Behaviors1 . การ้เช้�%อมื (Link) เล�อก Brows2 . ที่.าล$งค*ให้ก�บภาพห้ร้�อขอคว็ามื3 . เล�อก Taget

คว็ามืร้ เร้�%องอ�%น้ + ล กเล!น้ต!าง การ้สร้างลบและเพ$%มืเมืน้ ย!อย1 . การ้เพ$%มืใช้เมืาส*คล$กที่�% เคร้�%องห้มืาย

+

2 .การ้เพ$%มืใช้เมืาส*คล$กที่�% เคร้�%องห้มืาย -

คว็ามืร้ เร้�%องอ�%น้ + ล กเล!น้ต!าง การ้สร้างเมืน้ ย!อย1 . การ้เช้�%อมื (Link) เล�อก Brows2 . ที่.าล$งค*ให้ก�บภาพห้ร้�อขอคว็ามื3 . เล�อก Taget

คว็ามืร้ เร้�%องอ�%น้ + ล กเล!น้ต!าง การ้เข�ยน้ Code แที่ร้ก1 . เล�อกร้ ปแบบ Show Code View2 . พ$มืพ* Code เช้!น้ ค.าส�%งที่.าต�ว็อ�กษร้ว็$%ง<tr> <td width="614" bordercolor="#000000"

bgcolor="#333333" > <marquee scrolldelay="250">ขอคว็ามืที่�%ตองการ้ให้ว็$%ง

</marquee> </tr>

Dream

Documents

Transcript of Dream