นาย พลอธิป พิศภา เลขที่ 16 ชั้น ม.5/3: เมษายน 2015

วันพฤหัสบดีที่ 9 เมษายน พ.ศ. 2558

วันอังคารที่ 7 เมษายน พ.ศ. 2558

คำสั่งการเเทรกรูปภาพ

คำสั่งการเเทรกรูปภาพ

สำหรับในการแทรกรูปภาพบนหน้าเว็บเพจนั้นสามารถทำได้ง่ายๆ ด้วยการระบุคำสั่ง <IMG SRC="ชื่อรูปภาพ">ดังตัวอย่างนี้จะเป็นการแทรกรูปภาพทั้งเป้นพื้นหลังและในหน้าเว็บเพจ

<html>
  <head>
<title>
Insert Images : การแทรกภาพ
</title>
  </head>
  <body background="bgimage.gif">
ข้อความที่แสดงในส่วนเนื้อหา
<img src="kerokero.gif">
  </body>
</html>

ตัวอย่างการแสดงผลจากคำสั่งด้านซ้ายมือ

ข้อความที่แสดงในส่วนเนื้อหา
Kerokero

หากเราต้องการแสดงรูปให้มีขนาดต่างจากขนาดจริงของภาพ ก็สามารถทำได้ด้วยการกำหนดเพิ่มในส่วนของความกว้าง ความยาวของรูปภาพ ดังตัวอย่าง ภาพแรกคือภาพขนาดจริง ภาพที่สองเป็นการลดขนาดลง และภาพที่สามเป็นการเพิ่มขนาดขึ้น

<html>
  <head>
<title>
Insert Images : การกำหนดขนาดภาพ
</title>
  </head>
  <body>
แสดงการกำหนดขนาดภาพ<br>
<img src="daffy.gif"><br>
<img src="daffy.gif" width="50" height="51"><br>
<img src="daffy.gif" width="150" height="153"><br>
  </body>
</html>

ตัวอย่างการแสดงผลจากคำสั่งด้านซ้ายมือ

แสดงการกำหนดขนาดภาพ
Daffy

การจัดวางตำแหน่งรูปภาพจะใช้คำสั่งเดียวกันกับการวางตำแหน่งตัวอักษร และยังสามารถกำหนดเส้นขอบรอบรูปภาพ ด้วยการเพิ่มคำสั่งคุณสมบัติเส้นขอบ border ต่อจากชื่อรูปภาพได้ดังตัวอย่าง

<html>
  <head>
<title>
Insert Images : ตำแหน่งและเส้นขอบรูปภาพ
</title>
  </head>
  <body>
<div align="center">
ตำแหน่งและเส้นขอบรูปภาพ<br>
<img src="kerokero.gif" border="3">
</div>
  </body>
</html>

ตัวอย่างการแสดงผลจากคำสั่งด้านซ้ายมือ

ตำแหน่งและเส้นขอบรูปภาพ

รูปกบ Kero

นอกจากนี้แล้ว เรายังสามารถกำหนดให้มีการแสดงชื่อรูปภาพ หรือคำบรรยาย หรือรายละเอียดของรูปภาพได้เมื่อนำเมาท์ไปชี้บนรูปนั้น หรือในกรณีที่ผู้ชมบางคนกำหนดให้บราวเซอร์ไม่ต้องแสดงผลรูปภาพ เพื่อความรวดเร็วในการชมเว็บ รูปจะถูกแทนที่ด้วยชื่อ ที่เรียกว่า Alternative text โดยใช้วิธีการเพิ่มคุณสมบัติลงไปในคำสั่งแทรกรูปภาพ ดังตัวอย่าง

<img src="kerokero.gif" border="3" alt="รูปกบ kero">

END : สรุปคำสั่งที่ใช้ในบทนี้

TAGS	รายละเอียด
<br> <p> ... </p>	คำสั่งกำหนดการตัดคำขึ้นบรรทัดใหม่ ณ ตำแหน่งที่แทรกคำสั่งนี้ <br> คำสั่งกำหนดย่อหน้าข้อความ (จะเว้นบรรทัดทั้งก่อนหน้าและหลังย่อหน้านั้น 1 บรรทัด)
	การแทรกช่องว่างมากกว่า 1 เคาะวรรคด้วยการแทรกชุดอักขระพิเศษนี้แทน (1 ชุดแทน 1 เคาะวรรค)
<blockqoute> , <p style="text-indent:x">	การกำหนดการเยื้องข้อความให้ห่างจากขอบทั้งซ้ายและขวา การเยื้องย่อหน้าในบรรทัดแรก x เป็นตัวเลขระบุหน่วยพิกเซล แสดงผลได้ดีใน IE บราวเซอร์อื่นอาจเพี้ยนได้ สามารถใช้การแทรกอักขระพิเศษ (ชุดอักษรว่าง) ตามจำนวนเคาะวรรคที่ต้องการเยื้องแทนได้
<div align="left/center/right">	การกำหนดการจัดวางตำแหน่งของข้อความหรือรูปภาพ ค่าปกติคือซ้าย
<img src="name">	คำสั่งการแทรกรูปภาพในตำแหน่งต่างๆ name คือชื่อรูปภาพชนิด JPG, GIF, PNG

วันจันทร์ที่ 6 เมษายน พ.ศ. 2558

ใบงาน HTML

ให้สรุปคำสั่ง HTML มา 5 คำสั่ง

1.<HTML>.....</HTML> คือ คำสั่ง <HTML> คือคำสั่งเริ่มต้นในการเขียนโปรแกรม HTML และมีคำสั่ง</HTML> เพื่อบอกจุดสิ้นสุดโปรแกรม

2.<HEAD>.....</HEAD> คือ คำสั่ง <HEAD> คือคำสั่งบอกส่วนที่เป็นชื่อเรื่อง โดยมีคำสั่งย่อย <TITLE> อยู่ภายใน

3.<TITLE>.....</TITLE> คือ คำสั่ง <TITLE> คือคำสั่งบอกชื่อเรื่อง จะไปปรากฏที่ Title Bar

4.<BODY>.....</BODY> คือ คำสั่ง <BODY> คือคำสั่งบอกส่วนเนื้อเรื่อง ที่จะถูกแสดงผลในเวปบราวเซอร์ ประกอบด้วยรูปภาพ ตัวอักษร ตาราง เป็นต้น

5.<br> คือ คำสั่งขึ้นบรรทัดใหม่

วันพุธที่ 1 เมษายน พ.ศ. 2558

ใบงานที่6

1.หลักการเขียนภาษาคอมพิวเตอร์ หมายถึงอะไร
ตอบ

ขั้นตอนการเขียนโปรแกรมหรือพัฒนาโปรแกรม มีขั้นตอนโดยสังเขปดังนี้
การวิเคราะห์ปัญหาและความต้องการ (Problem Analysis and Requirement Analysis)
การกำหนดและคุณสมบัติของโปรแกรม (Specification)

การออกแบบ (Design)
การเขียนรหัสโปรแกรม (Coding)
การคอมไพล์ (Compilation)
การทดสอบการทำงานของโปรแกรม (Testing)
การจัดทำเอกสาร (Documentation)
การเชื่อมต่อ (Integration)
การบำรุงรักษา (Maintenance)

1.การวิเคราะห์ปัญหาและความต้องการ (Problem Analysis and Requirement Analysis)

เป็นการแยกแยะรายละเอียดของปัญหาและความต้องการออกเป็นส่วนย่อยๆ ให้ครอบคลุมการทำงานของโปรแกรมที่ต้องการเขียนทั้งหมด เพื่อให้เห็นถึงองค์ประกอบ ความสัมพันธ์ ความต้องการ และแนวทางการแก้ปัญหาที่ถูกต้องอย่างครบถ้วน

2.การออกแบบ (Design)
เป็นการออกแบบวิธีการแก้ปัญหา โดยการกำหนดขั้นตอน ทิศทาง รูปแบบการทำงานของโปรแกรม ผลลัพธ์ของโปรแกรม วิธีการประมวลผลและสูตรสมการต่างๆ การนำเข้าข้อมูล การกำหนดตัวแปรให้สอดคล้องกับข้อมูล การเลือกใช้โปรแกรมภาษา ทั้งนี้เพื่อให้การทำงานของโปรแกรมเป็นไปอย่างถูกต้อง และมีประสิทธิภาพมากที่สุด การออกแบบสามารถทำได้หลายวิธี แต่วิธีที่ได้รับความนิยมได้แก่ การเขียนขั้นตอนวิธี (Algorithms) การเขียนผังงาน (Flowcharts) และการเขียนรหัสลำลอง (Pseudo Code)

3.การเขียนรหัสโปรแกรม (Coding)

เป็นการเขียนรหัสโปรแกรมลงในโปรแกรมภาษาที่เลือกไว้ ตามวิธีการที่ได้ออกแบบไว้แล้ว โดยใช้คอมพิวเตอร์ที่ทำการติดตั้งโปรแกรมภาษาเอาไว้พร้อมที่จะทำการลงรหัสโปรแกรมและทดสอบความถูกต้องของโปรแกรม
4.การทดสอบการทำงานของโปรแกรม (Testing)

เป็นการทดสอบผลการทำงานของโปรแกรมว่ามีความถูกต้องและมีประสิทธิภาพหรือไม่ การทดสอบทำได้โดยการป้อนค่าต่างๆ ตามที่โปรแกรมกำหนด แล้วสังเกตผลลัพธ์ที่ได้ หากพบว่าผลลัพธ์ไม่ถูกต้องก็ย้อนกลับไปแก้ไขรหัสโปรแกรม หากพบว่าไม่มีประสิทธิภาพ เช่น โปรแกรมทำงานช้า โปรแกรมไม่ครอบคลุมความต้องการก็อาจย้อนกลับไปแก้ไขรหัสโปรแกรมหรือออกแบบวิธีการแก้ปัญหาใหม่ สำหรับการทดสอบนั้นจะต้องป้อนทั้งข้อมูลด้านบวก (ข้อมูลที่โปรแกรมต้องการ) และข้อมูลด้านลบ (ข้อมูลที่โปรแกรมไม่ต้องการ)

2.โปรเเกรมเเปลภาษาคืออะไร
ตอบ คือโปรแกรมคอมพิวเตอร์ที่แปลชุดคำสั่งของภาษาโปรแกรมหนึ่ง ไปเป็นชุดคำสั่งของอีกภาษาโปรแกรมหนึ่ง โดยความหมายดั้งเดิมไม่สูญเสียไป โปรแกรมแปลภาษาระดับสูงบางตัวจะเปลี่ยนแปลงตรรกะบางอย่าง หรือทำตรรกะให้ง่ายขึ้นโดยผลลัพธ์ยังเป็นเช่นเดิม

3.ตัวอย่างโปรเเกรมคอมพิวเตอร์ที่เขียนด้วยภาษาคอมพิวเตอร์ 1 โปรเเกรม
ตอบ notepad