วันพฤหัสบดีที่ 2 สิงหาคม พ.ศ. 2555

วันจันทร์ที่ 30 กรกฎาคม พ.ศ. 2555

บทที่6 การเชื่อมโยงหน้าเว็บเพจ

บทที่6 การเชื่อมโยงหน้าเว็บเพจ

     
                       
การเชื่อมโยงหน้าเว็บเพจ คือการกำหนดส่วนของข้อความ รูปภาพ หรือสัญลักณ์ไว้เป็นจุดเชื่อมโยง (Link)ไปยังเอกสารที่อยู่ใน ตำแหน่งอื่นๆ เช่น หน้าเดียวกัน หน้าอื่นๆ เว็บเพจหรือเว็บไซด์อื่นๆ
 
 
1.การเชื่อมโยงโดยใช้ข้อความ
 
 
<A HREF=ตำแหน่งที่ต้องการเชื่อมโยง > ข้อความที่ต้องการเชื่อมโยง</A>
 

2.การเชื่อมโยงโดยใช้รูปภาพหรือสัญลักษณ์
<A   HREF=ตำแหน่งที่ต้องการเชื่อมโยง > < IMG SRC="ชื่อสกุลไฟล์รูปภาพ"   ALT="คำอธิบาย"</A>

3.การเชื่อมโยงภายในเว็บเพจเดียวกัน
กำหนดจุดเชื่อมโยง(Link)
<A   HREF="#ชื่อจุดปลายทางที่ต้องเชื่อมโยง" > ข้อความ</A>



กำหนดจุดปลายทางที่ต้องเชื่อมโยง
<A   NAME="#ชื่อจุดปลายทางที่ต้องเชื่อมโยง" > ข้อความ</A>
4.การเชื่อมโยงไปยังเว็บเพจอื่น

 
<A   HREF="ชื่อไฟล์ปลายทางที่ต้องเชื่อมโยง" > ข้อความ</A>



5.การเชื่อมโยงไปยังเว็บไซด์อื่น
<A   HREF="http://ชื่อไฟล์ปลายทางที่ต้องเชื่อมโยง" > ข้อความ</A>




6.การเชื่อมโยงเพื่อดาวน์โหลดไฟล์
<A   HREF="ชื่อไฟล์ดาวน์โหลด" > ข้อความ</A>

บทที่5 การสร้างตาราง

บทที่5 การสร้างตาราง
                แท็กที่ใช้ในการสร้างตารางในภาษา HTML คือแท็ก <TABLE >.....< /TABLE>พร้อมด้วยแท็ก ส่วนประกอบต่างๆในการสร้างตาราง เช่น กำหนดสีเส้นของตาราง กำหนดขนาดตาราง การใส่สีและรูปภาพเพื่อทำพื้นหลังของตาราง เป็นต้น

1.การสร้างตาราง


<TABLE >..... < /TABLE> =เริ่มต้นและสิ้นสุดตาราง
< CAPTION> .... < /CAPTION> =ชื่อของตาราง
<TR > .... </TR> =การสร้างแถวให้กับตาราง
<TD > .... </TD> =การสร้างคอลัมน์กับตาราง

2.การสร้างเส้นขอบตาราง

 

<TABLE BORDER="ตัวเลขขนาดของขอบ" >

3.การกำหนดสีเส้นขอบตาราง

<TABLE BORDER="ตัวเลขขนาดของขอบ" BORDERCOLOR="รหัสสี">....< /TABLE>

4.การปรับขนาดของตาราง

 

<TABLE BORDER="ตัวเลขขนาดของขอบ" WIDTH ="ความกว้าง" HEIGHT="ความสูง">... < /TABLE>



5.การกำหนดสีพื้นหลังของตาราง

<TABLE BGCOLOR="รหัสสี">...< /TABLE>


6.การกำหนดรูปภาพพื้นหลังของตาราง

<TABLE BACKGROUND="ชื่อและนามสกุลของรูปภาพ">... < /TABLE>

วันเสาร์ที่ 28 กรกฎาคม พ.ศ. 2555

บทที่4 การจัดการรูปภาพ

บทที่4 การจัดการรูปภาพ           


การเขียนเว็บในรุ่นแรกๆ นั้นจะใช้ตัวอักษรและข้อความเป็นหลักในการนำเสนอ แต่ในช่วงเวลาไม่นานได้มีการพัฒนาใส่ภาพนิ่ง ภาพเคลื่อนไหว ใส่เสียง สิ่งเหล่านี้มีส่วนอย่างมากที่ทำให้เว็บเพจมีความสนใจ โดยทั่วไปไม่ควรเกิน 40 kb ถ้าเราใช้ไฟล์ที่มีขนาดเล็กก็จะทำให้เว็บเพจมีความรวดเร็วในการทำงาน


1.ประเภทของไฟล์รูปภาพ
1.1ไฟล์ประเภท GIF เป็นไฟล์ที่มีขนาดเล็ก คุณภาพต่ำเนื่องจากถูกบีบข้อมูลให้มีขนาดเล็ก แสดงสีได้256สี
1.2ไฟล์ประเภท JPEG เป็นไฟล์รูปภาพที่มีขนาดบีบอัดของข้อมูลน้อยกว่าฟล์ประเภท gifสามารถ ไแสดงสีได้ 16.7 ล้านสี
1.3ไฟล์ประเภท PNG เป็นไฟล์ภาพที่นำมาใช้แทนที่ไฟล์ประเภท GIF เนื่องจากสามารถแสดงภาพได้เร็วกว่า แต่ยังไม่ค่อยแพร่หลาย

2.การใส่รูปภาพลงในเว็บเพจ
<src="ชื่อไฟล์รูปภาพ">



3.ตำแหน่งในการจัดวางรูปภาพ

          <src="ชื่อไฟล์รูปภาพ"  aling=ตำแหน่งการวางภาพ>



          ตำแหน่งการจัดวางรูปภาพกำหนดได้ดังนี้
left=ด้านซ้าย
right=ด้านขวา
top=ด้านบน
bottom=ด้านล่าง
middle=ตรงกลาง


4.การใส่ข้อความอธิบายรูปภาพ






<img src="ชื่อไฟล์รูปภาพ" alt="ข้อความอธิบาย">

ตัวอย่างใส่code




เลื่อนเมาส์ไปวางบนรูปภาพ




5.การใส่กรอบรูปภาพ

              <img src="ชื่อไฟล์รูปภาพ" border=ขนาดของกรอบ>




บทที่3 การจัดและตกแต่งข้อความ

ทบที่3 การจัดและตกแต่งข้อความ

                  การจัดและตกแต่งข้อความให้สวยงามเป็นสี่งที่จำเป็นสำหรับการเขียนเว็บเพจ เพราะเป็นสี่งที่ดึงดูดความสนใจของผู้ที่เข้าไปท่องเว็บ ในหน่วยนี้เรา จะให้ศึกษาเกี่ยวกับการตกแต่งข้อความ การเน้นคำ การทำตัวอักษรแบบต่างๆ


1.การตกแต่งข้อความด้วยแท็ก FRONT




<font>=ชื่อแท็กที่ใช้กำหนดตัวอักษรในที่นี้คิอ front
<attribute>=บอกคุณสมบัติต่างๆ เช่น สี,ขนาด
<value>=ค่าที่ต้องการกำหนด ดังตัวอย่าง


2.การเน้นคำและตัวอักษรแบบต่างๆ







3.การระบุค่าสี ตัวอย่าง code สีในแบบ hex value และแบบ ชื่อของสี



4.การทำอักษรวิ่ง





วันพุธที่ 25 กรกฎาคม พ.ศ. 2555

ทบที่2 โครงสร้างและรูปแบบของภาษา

ทบที่2 โครงสร้างและรูปแบบของภาษา
        
        โครงสร้างและรูปแบบภาษา HTML จะใช้แท็กเปิดและเเท็กปิดในการควบคุมการทำงานของโปรแกรม ถ้าต้องการให้โปรแกรมทำงาน อย่างไรก็กำหนดแอตทริบิวต์ตามที่ต้องการได้

โครงสร้างของหลักของ HTML




1.โครงสร้างหลักของ HTML ก็จะเริ่มด้วย <html> และจบด้วย </html> เสมอ ซึ่งชุดคำสั่งที่ใช้จะแยกเป็น 2 ส่วนคือ


1. head คำสั่งที่อยู่ในส่วนนี้จะใช้บรรยายรายละเอียดเกี่ยวกับ web page ซึ่งจะไม่แสดงผลที่ web page โดยตรง
2. body คำสั่งที่อยู่ในส่วนนี้จะใช้ในการจัดรูปแบบตัวอักษร จัดหน้า ใส่รูปภาพ ซึ่งตัวอักษรในส่วนนี้จะแสดงที่ web brower โดยตรง


2.คำสั่งที่ใช้ในการขึ้นบรรทัดใหม่


<br> ขึ้นบรรทัดใหม่
<p> ขึ้นบรรทัดใหม่ และเว้น 1 บรรทัด
<nbsp;> ขึ้นบรรทัดใหม่ และเว้นหลายบรรทัด

3.การจัดตำแหนงข้อความ 


<align = 'left' > ชิดซ้าย
<align= 'right' > ชิดขวา
<align= 'center'> จัดเข้ากลาง


4.การย่อหน้า
<dd> การย่อหน้า




บทที่1แนะนำHTMLเบื้องต้น

บทที่1 แนะนำเบื้องต้น  

  HTML คือ ภาษาที่ใช้ในการเขียนเว็บเพจ ย่อมาจากคำว่า Hypertext Markup Language โดย Hypertext หมายถึง ข้อความที่เชื่อมต่อกันผ่านลิ้ง (Hyperlink) Markup หมายถึง วิธีในการเขียนข้อความ language หมายถึงภาษา ดังนั้น HTML จึงหมายถึง ภาษาที่ใช้ในการเขียนข้อความ ลงบนเอกสารที่ต่างก็เชื่อมถึงกันใน cyberspace ผ่าน Hyperlink นั่นเอง
 
              การสร้างเว็บเพจ คือ การสร้างไฟล์เพื่อนำข้อมูลไป  แสดงบนเว็บไซต์ด้วยโปรแกรมใดโปรแกรมหนึ่ง    โปรแกรมภาษาที่เป็นที่ รู้จักและใช้งานกันทั่วไปคือโปรแกรม HTML ซึ่งภาษา HTMLนี้เป็นเท็กซ์ ไฟล์ธรรมดาที่ใช้นามสกุลว่า  .htlm ปัจจุบันภาษา HTML  ได้ถูกกำหนดมาตรฐานขึ้นมาเป็นรุ่นที่ 4.0 มีขีดความสามารถสูงขึ้น   ด้วยความสามารถอันยอดเยี่ยมของ     HTML ข้อมูลจากแหล่งต่างๆจะถูกนำมาแสดงตรงหน้าผู้ใช้โดยคอมพิวเตอร์จะทำหน้าที่ประมวลผลผ่านโปรโตคอล HTPP โปรโตคอลหลักทำให้  ผู้ใช้สามารถติดต่อสื่อสารบนอินเทอร์เน็ตได้

   วิธีสร้างเว็บเพจด้วยภาษา html มีขั้นตอนดังนี้

   1.ให้คุณเปิดโปรแกรม Notepad ขึ้นมา โดยไปที่ All programs > Accessories > Notepad
ซึ่งโปรแกรม notepad จะมีหน้าตาแบบนี้



 2. ให้คุณพิมพ์ข้อความต่อไปนี้ ใน


3.  เมื่อพิมพ์เสร็จแล้วให้เราเลือก save as จะมีหน้าต่างออกมา ให้เราใส่ชื่อไฟล์เป็น begin.html และเลือก  ชนิดไฟล์ (save as type) เป็นแบบ All files จากนั้นก็ save ไฟล์



4. เราจะได้ไฟล์มาดังรูปข้างล่าง




5. ให้เราคลิกเพื่อเปิดไฟล์ begin.html เราก็จะเห็นเว็บไซต์แรกของเรา ซึ่งจะถูกเปิดโดยโปรแกรม internet explorer (ต่อไปนี้เราจะเรียกว่า Web Browser)



จบแล้วครับสำหรับบทนี้ลองหัดทำดูครับไม่ยากครับ