การแทรกตาราง

การแทรกตาราง

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

แท็กที่สำคัญในการสร้างตารางมีดังนี้

TABLE    คือ การบอกจุดเิ่ริ่มต้นและจุดสิ้นสุดในการสร้างตาราง

รูปแบบคำสั่ง       :            <table>................</table>

TR      ใช้สำหรับสร้างแถวของตาราง

รูปแบบคำสั่ง     :                   <tr>................</tr>

TD       คือ การบอกจำนวนคอลัมน์ (column)ในตาราง

รูปแบบคำสั่ง     :                   <td>................</td>  

การปรับความกว้าง (width)

  

width = "x"

        

          จะใช้กำหนดความกว้างของตาราง กำหนดค่า x ในรูปของ เปอร์เซ็นต์ ของขนาดพื้นที่ที่โปรแกรม web browser สามารถจะแสดงได้หรือกำหนดค่าเป็นตัวเลข เพื่อให้ web browser แปลงค่าไปเป็นค่าของ pixels

รูปแบบคำสั่ง     :             <table width = "200"> หรือ <table width = "70%">

การปรับความสูง (Hight)

 hight = "x"

       จะใช้สำหรับกำหนดความสูงของตาราง โดยสามารถกำหนดเป็นหน่วยของ Pixel หรือเป็นเปอร์เซ็นต์ได้ 

รูปแบบคำสั่ง       :             <table hight = "100"> หรือ <table hight = "30%">

การจัดตำแหน่งตาราง (Align)

align = "x"

     

          จะใช้เพื่อกำหนดตำแหน่งของตาราง โดยที่ค่า "x" มีค่าเป็น left, right หรือ center

โดยโปรแกรม web browser มีค่า default เป็น left

รูปแบบคำสั่ง        :               <table align = "left"> 

                         หรือ              <table align= "right"> 

                         หรือ              <table align = "center">

การรวมเซลล์ตาราง - rowspan,colspan

การรวมแถว

rowspan = "x"

       เป็นการรวมเซลล์ตามแนวตั้ง ตั้งแต่ 2 เซลล์ขึ้นไป เป็นเซลล์เดียวกัน โดยใช้คำสั่ง ROWSPAN กำหนดไว้ในคำสั่ง <TD> เหมือนการรวมคอลัมน์

รูปแบบคำสั่ง

        

          <TR> <TD ROWSPAN ="จำนวนแถวที่รวม"> ข้อความ </TD</TR>

การรวมคอลัมน์

colspan = "x"

       เป็นการรวมเซลล์ตามแนวนอนตั้งแต่ 2 เซลล์ขึ้นไป เป็นเซลล์เดียวกัน โดยใช้คำสั่ง COLSPAN กำหน ดไว้ในคำสั่ง <TD> 

รูปแบบคำสั่ง

        

      <TR> <TD COLSPAN = " จำนวนคอลัมน์ที่รวม " > ข้อความ </TD> </TR> 

ตัวอย่าง  

                         

ผลที่ได้

แหล่งที่มา  :  www.thainextstep.com/html/html_09.php

                       www.freewebs.com/maneemana/c3.html

7 กันยายน 2555

การแทรกรูปภาพ

การแทรกรูปภาพ

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

      รูปแบบแท็กการใส่รูปภาพ      <img src = "ชื่อภาพ">

ตัวอย่างโค้ด

ผลลัพธ์

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

1. ไฟล์ GIF (CompuServe Graphics Interchange Format) มีนามสกุล .gif เป็นไฟล์ชนิด บิตแมบ 8 บิตสี เก็บค่าสีสูงสุดได้ 256 สี เป็นไฟล์แบบบีบย่อขนาด ใช้แสดงผลพวกภาพ การ์ตูน หรือกราฟิกที่มีสีสันไม่มาก และภาพชนิดเคลื่อนไหวที่มีความละเอียดไม่มากนัก

2. ไฟล์ JPEG หรือ JPG (Joint Photographic Experts Group) มีนามสกุล .jpg เป็นไฟล์ที่ พัฒนาเพื่อใช้งานกับภาพที่มีสีสันสดใสและความละเอียดสูงมาก สามารถเก็บภาพได้ 24 บิตสี แสดงสีได้ถึง 16.7 ล้านสี เป็นไฟล์ที่ผ่านกระบวนการบีบอัดข้อมูลในอัตรา 10:1 ใน การแสดงผลในเว็บเพจ ไฟล์ *.jpg จะแสดงผลช้ากว่าไฟล์ *.gif ในขนาดไฟล์ที่เท่ากัน ดังนั้นจึงนิยมใช้ไฟล์ *.jpg ในภาพขนาดใหญ่ ถ้าเป็นภาพขนาดเล็กจะใช้ไฟล์ชนิด *.gif มากกว่า

3. ไฟล์ PNG (Portable Network Graphic) เป็นไฟล์ที่พัฒนาขึ้นมาโดยนำเอาคุณสมบัติที่ดีเด่นของไฟล์ GIF และ JPG มารวมกัน กล่าวคือสนับสนุนจำนวนบิตสีได้ถึง 24 บิต เหมือนกับภาพแบบ JPG ในขณะที่การบีบอัดไฟล์ใช้การทำงานแบบ GIF การแสดงผลในแบบ Interlace และยังสามารถทำภาพโปร่งใสได้


แหล่งอ้างอิง: http://www.thainextstep.com/html/html_06.php
                   http://www.bcoms.net/html/08.asp


22 august 2012

การแต่งตัวอักษร

การแต่งตัวอักษร

การกำหนดแบบอักษร

    คำสั่ง < FONT FACE > เป็นการกำหนดชนิดของตัวอักษรตามที่เราต้องการ ชื่อชนิดของตัวอักษรจะใช้ตามชื่อตามโปรแกรม Word และเมื่อจบประโยคหรือข้อความที่เราต้องการจะต้องจบด้วย </FONT>

            รูปแบบคำสั่ง <FONT FACE = “ชนิดของตัวอักษรที่เราต้องการ”>...ข้อความ...</FONT>

ตัวอย่าง

ผลลัพธ์

การกำหนดขนาดตัวอักษร

   การกำหนดขนาดของตัวอักษรเราจะใช้คำสั่ง <FONT SIZE> ซึ่งระดับตัวอักษรจะมีขนาด-7ถึง+7 

และจบคำสั่งด้วย < /FONT > 

      รูปแบบคำสั่ง <FONT SIZE = “ ตัวเลข -7ถึง +7 ”>...ข้อความ...</FONT>

ตัวอย่าง

 

ผลลัพธ์

การกำหนดสีตัวอักษร

         การกำหนดสีของตัวอักษรเราจะใช้คำสั่ง <FONT COLOR> ซึ่งเป็นคำสั่งใช้ในการกำหนดสีตัวอักษรและจบคำสั่งด้วย < /FONT > 

      รูปแบบคำสั่ง <FONT COLOR= “ สีเป็นภาษาอังกฤษหรือรหัสสี ”>...ข้อความ...</FONT>

ตัวอย่าง

                           

ผลลัพธ์

                          

การกำหนดรูปแบบตัวอักษร

         เป็นการกำหนดลักษณะตัวอักษรแบบเจาะจงไม่ว่าจะแสดงบนบราวเซอร์ใด ก็จะแสดงผลเหมือนกัน เช่น การกำหนดให้ตัวอักษรเป็นตัวหนา ตัวเอียง ตัวขีดฆ่า ตัวขีดเส้นใต้ แสดงแบบเลขยกกำลังในสูตรทางคณิตศาสตร์ หรือแสดงแบบตัวห้อยในสูตรทาง

วิทยาศาสตร์ เป็นต้น

กำหนดตัวอักษรเป็นตัวหนา

                        รูปแบบคำสั่ง   <B> …</B>

กำหนดตัวอักษรเป็นตัวเอียง

                        รูปแบบคำสั่ง   <I> …</I>

กำหนดตัวอักษรเป็นตัวขีดเส้นใต้

                        รูปแบบคำสั่ง   <U> …</U>

กำหนดตัวอักษรเป็นตัวขีดฆ่า

                        รูปแบบคำสั่ง   <S> …</S>

กำหนดตัวอักษรเป็นตัวอักษรยกขึ้น

                        รูปแบบคำสั่ง   <SUP> …</SUP>

กำหนดตัวอักษรเป็นตัวอักษรห้อย

                        รูปแบบคำสั่ง   <SUB> …</SUB>

กำหนดตัวอักษรเป็นตัวอักษรกระพริบ

                        รูปแบบคำสั่ง  <BLINK>...</BLINK> 

กำหนดตัวอักษรเป็นตัวอักษรวิ่ง

                        รูปแบบคำสั่ง   <MARQUEE>...</MARQUEE>

ตัวอย่าง

ผลลัพธ์

                                

การกำหนดตำแหน่งข้อความ

  คือการกำหนดให้ข้อความชิดซ้าย ชิดขวา หรืออยู่กึ่งกลางหน้ากระดาษมีรูปแบบดังนี้

     รูปแบบคำสั่ง <P ALIGN =“LIEFT/CENTER/RIGHT”>….</P>

ตัวอย่าง

ผลลัพธ์

แหล่งอ้างอิง

 http://113.53.238.199/it/elearning/html/html2.html

 http://school.obec.go.th/krurenu/html/p2-4.html

 http://www.blmiacec.ac.th/E-learning/HTML2004/PAGE04.HTM

11 /07/2012

HTML tag พื้นฐาน

HTML ย่อมาจาก  Hypertext Markup Language   ใช้โปรแกรม  Note Pad สร้าง และใช้โปรแกรม Web browser เปิดดูเอกสารเช่น IE  ,Google chome เป็นต้น

Text Editor คือ โปรแกรมที่ใช้สำหรับสร้างและแก้ไขข้อความในการสร้างเว็บเพจด้วยภาษา HTML มี โปรแกรม Text Editor เช่น NotePad, EditPlus หรือโปรแกรม Dreamweaver

องค์ประกอบของเอกสาร HTML มีดังนี้

     1. ส่วน Head คือส่วนที่จะเป็นหัว (Header) ของหน้าเอกสารทั่วไป หรือส่วนชื่อเรื่อง (Title) ของหน้าต่างการทำงานในระบบ Windows

      2. ส่วน Body จะเป็นส่วนเนื้อหาของเอกสาร ซึ่งจะประกอบด้วย Tag คำสั่งในการจัดรูปแบบ หรือตกแต่งเอกสาร HTML 

แบบตัวอย่างการเขียนโค้ด

                                       

ผลการแสดงของโค้ด

                                              
                         

 <html> คือ  เป็นคำสั่งเริ่มต้นในกานเขียนโปรแกรม

 <head> คือ เป็นส่วนที่ใช้อธิบายข้อมูลเฉพาะของหน้าเว็บนั้นๆ

  <title> คือ  เป็นส่วนที่มีข้อความที่เป็นคำสำคัญในการค้นหา

 <body> คือ  เป็นส่วนเนื้อหาหลักของเว็บ

  <BR> คือ การขึ้นบรรทัดใหม่

  <P> คือ  การขึ้นย่อหน้าใหม่

  

แหล่งอ้างอิง :   www.w3schools.com/html/default.asp

                          www.bcoms.net/html/index.asp  / 12 มิ.ย. 2555

คำศัพท์

คำศัพท์

คำศัพท์พื้นฐานเกี่ยวกับการสร้างเว็บ

Internet    หมายถึง เครือข่ายคอมพิวเตอร์ขนาดใหญ่ ที่มีการเชื่อมต่อระหว่างเครือข่ายหลายๆ เครือข่ายทั่วโลก โดยใช้ภาษาที่ใช้สื่อสารกันระหว่างคอมพิวเตอร์ ผู้ใช้เครือข่ายนี้สามารถสื่อสารถึงกันได้ในหลายๆ ทางและสามารถสืบค้นข้อมูลและข่าวสารต่างๆได้

www  หมายถึง world wide web  คือพื้นที่ที่เก็บข้อมูลข่าวสารที่เชื่อมต่อกันทางอินเทอร์เน็ต โดยการกำหนด URL คำว่าเวิลด์ไวด์เว็บมักจะใช้สับสนกับคำว่า อินเทอร์เน็ต โดยจริงๆแล้วเวิลด์ไวด์เว็บเป็นเพียงแค่บริการหนึ่งบนอินเทอร์เน็ต

                                                    
webpage หมายถึง หน้าหนึ่ง ๆ ของเว็บไซต์ ที่เราเปิดขึ้นมาใช้งาน
โดยทั่วไป เว็บเพจส่วนใหญ่จะอยู่ในรูปของเอกสาร HTML หรือ XHTML  มีลิงก์สำหรับเชื่อมโยงไปยังเว็บเพจหน้าอื่น ๆ

                                                

website หมายถึง แหล่งความรู้หรือข้อมูลข่าวสารที่ถูกเก็บไว้บนระบบ เน็ตเวิร์ก (Network) ออนไลน์ (Online) ที่เรียกว่า อินเตอร์เน็ต (Internet) 

                                                      
homepage หมายถึง หน้าแรกที่แสดงข้อมูลของเว็บไซต์ หรือ WWW (World Wide Web) เพื่อเป็นการประชาสัมพันธ์ หรือ เป็นการดึงดูด ให้เข้าไปชมข้อมูลภายใน  

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

HTML หมายถึง ภาษาที่ใช้ในการเขียนเว็บเพจ ย่อมาจากคำว่า Hypertext Markup Language เป็นภาษาที่ใช้ในการเขียนข้อความ ลงบนเอกสารที่ต่างก็เชื่อมถึงกันใน cyberspace ผ่าน Hyperlink นั่นเอง

                                                

URl หมายถึง   The Uniform Resource Locators เป็นเสมือนที่อยู่ของเอกสารบนเว็บ ทุกๆ เอกสารจะต้องมี URL เป็นของตัวเอง แต่ละส่วนของ URL เป็นสิ่งที่ใช้ระบบข้อมูลเกี่ยวกับที่ตั้งของเอกสาร

                                             

แหล่งที่มา www.xvlnw.com/knowledge-readknowledge-id59.htm
                  www.w3schools.com/html/default.asp  / 30 พ.ค. 2555

แนะนำตัวครับ

ผมชื่อนายอุกฤษฏ์  เทพสมบูรณ์ อยู่ชั้นม.6/2    ชื่อเล่นชื่อ  ดอย 
ศึกษาอยู่ที่   โรงเรียนธนบุรีวรเทพีวรเทพีพลารักษ์  เกิดเมื่อวันที่ 4 ตุลาคม พ.ศ.2537
เบอร์โทร 0891485735  e-mail  :  ukitwpy504@hotmail.com

facebook  : Hachi kung