วันพฤหัสบดีที่ 12 กันยายน พ.ศ. 2556

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

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

ส่วนประกอบของตาราง

      
 1.เซลล์ (cell)   
      
 2. แถว (row)
      
  3.คอลัมน์ (column)

Tag ที่เกี่ยวข้องกับตารางมี ดังนี้้่

         <TABLE>...ระบุว่่าสิ่งที่อยู่ภายใน....</TABLE>(จะแสดงอยู่ในตาราง) เป็นการบอกจุดเริ่มต้นและจุดสิ้นสุดของตาราง

         <TR>...ระบุว่่าสิ่งที่อยู่ภายใน...</TR>(จะแสดงอยู่ในแถวเดียวกัน) เป็นการบอกจำนวนแถว (row)

         <TD>...ระบุว่่าสิ่งที่อยู่ภายใน...</TD>(จะแสดงอยู่ในเซลล์เดียวกัน) เป็นการบอกจำนวนคอลัมน์ (column)

  

การปรับขนาดความกว้าง (WIDTH) และความสูง (HEIGHT)

        การกำหนดความกว้างและความสูงให้กับตาราง WIDTH และ HEIGHT ในแท็ก <TABLE>

 

ตัวอย่าง Code

 

ผลจาก Code


การใส่ขอบตาราง

    Border คือ ความหน้าของเส้นตาราง

          เมื่อ "x" มีค่าได้ตั้งแต่ ศูนย์ขึ้นไป ใช้กำหนดขนาดของเส้นขอบตาราง

 

ตัวอย่าง Codc


 

 ผลจาก Code

การรวมเซลล์

           เป็นการผสานเซลล์ตั้ง 2 เซลล์ขึ้นไป การรวมเซลล์มี 2 ลักษณะ คือ การรวมคอลัมน์(COLUMN) และการรวมแถว(ROW)

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

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

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


 ตัวอย่าง Codc

 

 ผลจาก Code

 

  • การรวมแถว

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

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

 ตัวอย่าง Codc

 

 ผลจาก Code


 



แหล่งอ้างอิง:http://school.obec.go.th/pp_school/html/table.html
                     http://www.kty.ac.th/html/unit5/unit503.html

เขียนโดย ที่ ไม่มีความคิดเห็น:

วันจันทร์ที่ 9 กันยายน พ.ศ. 2556

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

รูปแบบโค้ดในการแทรกรูปภาพ

 กรณีที่ 1  รูปภาพอยู่ที่เดียวกับไฟล์เว็บเพจ

      <img src="x"> โดยที่ "x" คือไฟล์รูปภาพที่ต้องการแสดง เช่น

               รูปแบบcode  <img src="แตงโม.jpg">

 

การแสดงผล

 กรณีที่ 2 รูปภาพอยู่คนละที่กับไฟล์เว็บเพจ

     หากรูปภาพไม่ได้เก็บไว้ที่ path(ตำแหน่ง) เดียวกับเอกสารhtml จะต้องระบุ path ของรูปภาพไว้หน้าไฟล์ด้วย เช่น

      รูปแบบcode <img src="sirinad/images/แตงโม.jpg">

 การแสดงผล

 IMG SRC คือ การอ้างแหล่งที่อยู่ของรูปภาพ ตัวอย่างการใช้ img ร่วมกับ src

                   code <img src="sirinad/images/lovetangmo.jpg">

 

การปรับความกว้าง Width

           Code <IMG SRC ="ชื่อรูปภาพ" width=ขนาดความกว้าง>

 

การปรับความสูง Height

        Code <IMG SRC ="ชื่อรูปภาพ" height=ขนาดความสูง>

การจัดตำแหน่งภาพ Align

  • top กำหนดตำแหน่งให้รูปภาพไปอยู่ด้านบน
  • bottom กำหนดตำแหน่งให้รูปภาพไปอยู่ด้านล่าง
  • middle',center กำหนดตำแหน่งให้รูปภาพไปอยู่ตรงกลาง
  • left กำหนดตำแหน่งให้รูปภาพไปอยู่ด้านซ้าย
  • right กำหนดตำแหน่งให้รูปภาพไปอยู่ด้านขวา
             Code<center><IMG SRC ="ชื่อรูปภาพ"></center>

   

ตัวอย่าง Code 

<center><IMG SRC ="แตงโม.jpg" width= 100 height=200></center>

 

  การแสดงผล

 

อ้างอิง http://www.sadung.com/?p=5850

เขียนโดย ที่ ไม่มีความคิดเห็น:

วันเสาร์ที่ 7 กันยายน พ.ศ. 2556

HTML tag พื้นฐาน

HTML ย่อมาจาก Hyper Texl Markup Language

ใช้โปรแกรมอะไรสร้าง?

โปรแกรมที่ใช้เปิดผลลัพธ์ของ html คือ โปรแกรมประเภท web browser ได้แก่ Google Crom,Firefox,IE

Text Editor

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

องค์ประกอรของเอกสาร html

เอกสาร html จะมีองค์ประกอบหลักๆ อยู่ 2 ส่วนคือ

  • ข้อความที่ต้องการให้แสดงบนจอภาพ
  • ข้อความที่เป็นคำสั่ง  

 ตัวอย่างCode และ การแสดงผล

<html>......</html>   

         คือ คำสั่ง <HTML> เป็นคำสั่งเริ่มต้นในการเขียนโปรแกรมและคำสั่ง </HTML> เป็นการสิ้นสุดโปรแกรม HTML คำสั่งนี้จะไม่แสดงผลในโปรแกรมเว็บเบราเซอร์ แต่ต้องเขียนเพื่อให้เกิดความเป็นระบบของงาน และเพื่อจะให้รู้ว่าเอกสารนี้เป็นเอกสารของภาษา HTML ส่วนหัวเรื่องเอกสารเว็บ (Head Section)

<head>......</head>

         คือ Head Section เป็นส่วนที่ใช้อธิบายเกี่ยวกับข้อมูลเฉพาะของหน้าเว็บนั้น ๆ เช่น ชื่อเรื่องของหน้าเว็บ (Title), ชื่อผู้จัดทำเว็บ(Author), คีย์เวิร์ดสำหรับการค้นหา (Keyword) โดยมี Tag สำคัญ คือ

<title>......</title>ด

         คือ ข้อความที่ใช้เป็น TITLE ไม่ควรพิมพ์เกิน 64 ตัวอักษร, ไม่ต้องใส่ลักษณะพิเศษ เช่น ตัวหนา เอียง หรือสี และควรใช้ภาษาที่มีความหมายครอบคลุม ถึงเนื้อหาของเว็บเพจ นั้น หรือเป็นคำสำคัญในการค้นหา (Keyword)

<body>......</body>

         คือ Body Section เป็นส่วนเนื้อหาหลักของหน้าเว็บ ซึ่งการแสดงผลจะต้องใช้ Tag จำนวนมาก ขึ้นอยู่กับลักษณะของข้อมูล เช่น ข้อความ, รูปภาพ, เสียง, วีดิโอ หรือไฟล์ต่างๆส่วนเนื้อหาเอกสารเว็บ เป็นส่วนการทำงานหลักของหน้าเว็บ ประกอบด้วย Tag มากมายตามลักษณะของข้อมูล ที่ต้องการนำเสนอ การป้อนคำสั่งในส่วนนี้ ไม่มีข้อจำกัดสามารถป้อนติดกัน หรือ 1 บรรทัดต่อ 1 คำสั่งก็ได้ แต่ส่วนใหญ่จะยึดรูปแบบที่อ่านง่าย คือ การทำย่อหน้าในชุดคำสั่งที่เกี่ยวข้องกัน ทั้งนี้ให้ป้อนคำสั่งทั้งหมดภายใต้ Tag <BODY> … </BODY>

<BR>

        คือ รูปแบบคำสั่งการขึ้นบรรทัดใหม่

<P> 

        คือ รูปแบบคำสั่งการขึ้่นย่อหน้าใหม่

ตัวอย่างCode

การแสดงผล

 
แหล่งอ้างอิง https://sites.google.com/site/easyhtmllanguage/khwam-hmay-khxng-html
http://pirun.ku.ac.th/~agrtnk/web/units/unit1/unit1-3.htm


เขียนโดย ที่ ไม่มีความคิดเห็น:

วันพฤหัสบดีที่ 20 มิถุนายน พ.ศ. 2556

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

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

  •   WWW ย่อมาจาก World Wide Web ซึ่ง WWW นั้น เป็นชื่อบริการชนิดหนึ่งอินเตอร์เน็ต ซึ่งได้รับความนิยม มาก ที่สุดบริการหนึ่ง เพราะเป็นบริการที่ให้ทั้งข้อมูล ข่าวสาร ความรู้ต่าง ๆ และยังให้ความบันเทิงทั้งภาพและเสียง ซึ่งเป็นที่ดึงดูด ผู้ใช้บริการ

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

  • Web Site หมายถึง แหล่งที่เก็บรวบรวมข้อมูลเอกสารและสื่อประสมต่าง ๆ เช่น ภาพ เสียง ข้อความ ของแต่ละบริษัทหรือหน่วยงานโดยเรียกเอกสารต่าง ๆ เหล่านี้ว่า เว็บเพจ (Web Page) และเรียกเว็บหน้าแรกของแต่ละเว็บไซต์ว่า โฮมเพจ (Home Page) หรืออาจกล่าวได้ว่า เว็บไซต์ก็คือเว็บเพจอย่างน้อยสองหน้าที่มีลิงก์ (Links) ถึงกัน ตามหลักคำว่า เว็บไซต์จะใช้สำหรับผู้ที่มีคอมพิวเตอร์แบบเซิร์ฟเวอร์หรือจดทะเบียนเป็นของ ตนเองเรียบร้อยแล้วเช่น www.google.co.th ซึ่งเป็นเว็บไซต์ที่ให้บริการสืบค้นข้อมูลเป็นต้น

  • Web page หมายถึง หน้าหนึ่ง ๆ ของเว็บไซต์ ที่เราเปิดขึ้นมาใช้งาน

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

  •  Web Browser ประโยชน์ สามารถดูเอกสารภายในเว็บเซิร์ฟเวอร์ได้ อย่างสวยงามมีการแสดงข้อมูลในรูปของ ข้อความ ภาพ และระบบมัลติมีเดียต่างๆ ทำให้การดูเอกสารบนเว็บมีความน่าสนใจมากขึ้น ส่งผลให้อินเตอร์เน็ตได้รับความนิยมเป็นอย่างมากเช่นในปัจจุบัน ปัจจุบัน web browser ส่วนใหญ่จะรองรับ html 5 และ อ่าน css เพื่อความสวยงามของหน้า web page

  • URL ย่อมาจาก Uniform Resource Locator

  • URL หมายถึง ที่อยู่ (Address) ของข้อมูลต่างๆใน Internet เช่น ที่อยู่ของไฟล์หรือเว็บไซต์บนอินเตอร์เน็ต


  • HTTP ย่อมาจาก Hyper Text Transfer Protocol

  • HTTP หมาย ถึง โปรโตคอลสื่อสารที่ทำงานอยู่บนระบบโปรโตคอล TCP HTTP ใช้ในระบบเครือข่ายใยแมงมุม (World Wide Web) ทำหน้าที่ในการจำหน่าย,แจกจ่าย รวมไปถึงการรับข้อมูล จากระบบสื่อกลางชั้นสูง (Hypermedia System) ที่ประกอบด้วยเครื่องให้บริการ (Server) ที่มีอยู่มากมายทั่วโลก เวลาเราเข้าเว็บ ด้วย Browser เช่น IE (Internet Explorer), FF(FireFox) หรือ Google Chrome หรือ Browser ตัวอื่นๆ เวลาเราเรียกดูเว็บ เช่น เว็บนี้ mindphp.com เราก็ต้อง พิมพ์ http://www.mindphp.com จะเห็นว่า ชื่อเว็บที่เราพิมพ์ ต้อง ขึ้นต้นด้วย http ด้วย


ที่มา
http://www.civicesgroup.com/
http://www.natnaree.com/
http://www.mindphp.com/













เขียนโดย ที่ 1 ความคิดเห็น:

วันพฤหัสบดีที่ 6 มิถุนายน พ.ศ. 2556




ชื่อ: น.ส.สิรินาถ   สายเสมา
ชื่อเล่น: แตงโม
เลขที่: 14 ชั้น: ม.6/2
อยู่โรงเรียน: ธนบุรีวรเทพีพลารักษ์
แผนการเรียน: วิทยาศาสตร์ - คณิตศาสตร์
ชอบเรียนวิชา: ชมรม(ผ้าบาติก)
อาหานที่ชอบ: แกงเขียวหวานลูกชิ้นปลากราย
สีที่ชอบ: สีชมพูกับสีเขียว
คติประจำใจ: แรดอย่างสงบ ตบเมื่อจำเป็น ตอแหลอย่างเยือกเย็น เพราะเราเป็นไฮโซ!~
งานอดิเรก: อ่านหนังสือนวนิยาย ฟังเพลง เล่นอินเตอร์เน็ต
Facebook: Sirinad Saisema
IG: Sirinads
Line: Sirinads
E-Mail: momotaro12@hotmail.com
เขียนโดย ที่ 2 ความคิดเห็น:
สมัครสมาชิก: ความคิดเห็น (Atom)