slide1
Download
Skip this Video
Download Presentation
การสร้าง Frame

Loading in 2 Seconds...

play fullscreen
1 / 20

การสร้าง Frame - PowerPoint PPT Presentation


  • 220 Views
  • Uploaded on

การสร้าง Frame. การสร้าง Frame สามารถสร้างได้หลายวิธี 1. จากหน้าหลักเมื่อเปิดโปรแกรม 2. จากเมนูคำสั่ง 3. จากแถบเครื่องมือ Layout. การสร้าง Frame(1). คลิกที่ Framesets ตามภาพด้านบน. คลิก Framesets เลือก Fixed Top, Nested Left คลิก Create. แสดงภาพเฟรมที่เลือก คลิก Cancel.

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

PowerPoint Slideshow about ' การสร้าง Frame' - alta


An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
slide2

การสร้าง Frame

สามารถสร้างได้หลายวิธี

1.จากหน้าหลักเมื่อเปิดโปรแกรม

2.จากเมนูคำสั่ง

3.จากแถบเครื่องมือ Layout

slide3

การสร้าง Frame(1)

คลิกที่ Framesets ตามภาพด้านบน

slide6

จากหน้าไฟล์งานเว็บเพจนำรูป ข้อมูลมาวางตามส่วนที่ถูกแบ่ง

slide7

Save โดยใช้คำสั่ง File Save All ตั้งชื่อ Index.html จะเป็นหน้าหลักทั้งหน้า

slide8

ตรงกลางตั้งชื่อ Main.html(จะเห็นเส้นให้เห็นขอบเขตที่เป็นพื้นที่งาน)

slide9

ด้านซ้ายตั้งชื่อ Left.html(จะเห็นเส้นให้เห็นขอบเขตที่เป็นพื้นที่งาน)

slide10

ด้านบนตั้งชื่อ Top.html(จะเห็นเส้นให้เห็นขอบเขตที่เป็นพื้นที่งาน)

slide11

ทดสอบโดยการกด F12 เพื่อRun โปรแกรมดูหน้าเว็บ

slide12

การสร้าง Frame(2)

เปิดโปรแกรมแถบ Create New คลิก HTML

slide13

การสร้าง Frame(2)

1. แถบเมนู View เลือก Visual Aids เลือก Frame Border ตามรูป

slide14

การสร้าง Frame(2)

2 แสดงหน้าไฟล์งาน เรียกแถบคำสั่งพาเล็ต Window frameเพื่อดูการทำงาน

slide15

การสร้าง Frame(2)

3 นำเมาส์ลากเส้นจากขอบกระดาษลงมา(1)และถ้าต้องการเส้นข้างให้คลิกที่

1

2

ขอบภาพ ลูกศร(2)เฉพาะด้านซ้ายแล้วลากเส้นขอบออกมาดังภาพจะได้เฟรมตามต้องการ จากนั้นใส่เนื้อหาและบันทึกไฟล์งานด้วยคำสั่ง Save All

slide16

การสร้าง Frame(3)

เปิดโปรแกรมแถบ Create New คลิก HTML

slide17

การสร้าง Frame(3)

1. แถบเครื่องมือ Layout เลือกรูปแบบต่าง ๆ ตามเมนูย่อยดังภาพด้านล่าง

slide18

การสร้าง Frame(3)

แสดงภาพเฟรมที่เลือก คลิก Cancel

จากนั้นใส่เนื้อหาและบันทึกไฟล์งานด้วยคำสั่ง Save All

slide19

ถ้าต้องการเพิ่มเส้นขอบกับแถบเลื่อนใช้คำสั่งเพิ่มเติมถ้าต้องการเพิ่มเส้นขอบกับแถบเลื่อนใช้คำสั่งเพิ่มเติม

จากคำสั่งใน Frame

<frameset rows="206,*" cols="*" frameborder="Yes" border="10" bordercolor=blue framespacing="10">

<frame src="Top.html" name="topFrame" scrolling="No" noresize="noresize" id="topFrame" />

<frameset rows="*" cols="162,*" framespacing="10" frameborder="Yes" border="10" bordercolor=blue>

<frame src="Left.html" name="leftFrame" scrolling="Yes" noresize="noresize" id="leftFrame" />

<frame src="Main.html" name="mainFrame" id="mainFrame" />

</frameset>

</frameset>

slide20

ใบงานการสร้างเฟรม

1. ให้นักศึกษาออกแบบเว็บไซต์ร้านเสื้อผ้า 2. ใช้คำสั่งแบ่งแฟรมเพื่อตกแต่งเว็บให้น่าสนใจ3. มีหน้าหลัก การลิงค์รูปแบบต่าง ๆ 4. มี Banner อยู่ด้านบนของหน้าจอ โดยนักศึกษาสร้างขึ้นมาเองด้วยโปรแกรมที่นักศึกษาเรียนมา 5. ให้หารูปภาพและเนื้อหา จากเว็บ Google 6. มีอย่างน้อย 8 ไฟล์พร้อมหน้าหลักทำการตบแต่งให้สวยงาม

7. ส่งภายในชั่งโมงเท่านั้น

ad