ภาษา HTML

การเขียนภาษา html

เริ่มต้นไปที่ปุ่ม start คลิกคำว่า All Programs เลื่อนเมาท์ ไปที่ Accessories และไปที่ Notepad คลิก

แล้วหน้า Notepad จะเปิดขึ้น  จากนั้นต้องใช้ภาษาเขียนดังนี้

<html> เป็นสัญลักษณ์เปิด

</html> เป็นสัญลักษณ์ปิด

<head>

</head>

<title>

</title>

<body>

</body>

เหล่านี้เป็นคำสั่งน้ำจิ้ม สนใจรายละเอียดติดต่อเรา

ลองเขียนดูนะ

<html>

            <head>

<title>kame tutor</title>

      </head>

      <body>

                  <h1>kame tutor รับสอนพิเศษ</h1>

      </body>

</html>

เมื่อเขียนเสร็จต้องทำการ save  เลื่อนเมาท์ไปที่ File ตรงแถบเครื่องมือด้านบน

คลิกแล้วเลือก save as ไปที่ช่อง File name: เติมชื่อไฟล์อะไรก็ได้ แต่ในที่นี้

จะใส่ว่า kame.html อย่าลืมใส่นามสกุลทุกครั้งว่า .html และที่ช่อง Save as type:

ให้เลือก All files ส่วนช่อง Encoding: ให้เลือก UTF – 8 หลังจากนั้นกด Save

ใน Save in: Desktop

ต่อจากนั้นไปดับเบิ้ลคลิกที่ เครื่องหมาย Internet ชื่อ file ว่า Kame หน้าต่างรูปจะออกมาประมาณนี้

 

 

ลองทำกันดูนะค่ะ  วันหลังมาสร้างกันต่ออีก  วันนี้แค่นี้ก่อน 

รู้จักกับ  HTML

แนวคิด

การศึกษาพื้นฐานในการเขียนโฮมเพจ (Homepage) เพื่อให้ผู้เรียนทราบถึงที่มาของโครงสร้างและการเขียนคำสั่งเบื้องต้น  สามารถนำเครื่องมือ (Tools) มาใช้ในการเขียนโฮมเพจได้อย่างถูกต้อง

จุดประสงค์  เพื่อให้ผู้เรียนสามารถ

  1. อธิบายความหมายของ HTML ได้
  2. บอกคุณสมบัติของเครื่องคอมพิวเตอร์ที่จะนำมาใช้ในการสร้าง WebPage ได้
  3. เขียนโครงสร้างพื้นฐานของภาษา HTML ได้ถูกต้อง
  4. เขียนคำสั่ง HTML โดยใช้ Notepad เป็น Editor ได้

ขอบข่ายเนื้อหา

  • คุณสมบัติของเครื่องที่สามารถนำมาใช้ในการสร้าง Web Page
  • โครงสร้างพื้นฐานของ HTML
  1. การเขียน HTML
  2. กฎในการใช้ HTML
  3. ส่วนประกอบพื้นฐานของเอกสาร HTML
  • การใช้ Notepad ในการเขียน HTML

HTML (HyperText Markup Language) เป็นโปรแกรมภาษาที่ใช้ในการสร้างเอกสารที่จะนำเสนอข้อมูลผ่านโปรแกรมอ่านเอกสาร (Web browser) ก่อนแล้วใช้ชุดคำสั่งของ HTML แทรกเข้าไปในเอกสารนั้นเพื่อควบคุมการจัดการกับส่วนของเอกสารนั้น ๆ เช่นจัดฟอนต์ จัดตำแหน่ง กำหนดสี กำหนดการเชื่อมโยงกับส่วนอื่น ๆ กำหนดภาพ ฯลฯ  โดยที่ลักษณะของเอกสารที่สร้างจะเหมือนกับ Text File ทั่วไปแต่จะมีคำสั่งของ HTML แทรกอยู่ซึ่งจะทำให้เอกสารนั้นทำงานแบบ Hyper text เมื่อถูกอ่านโดย Web browser

Markup Language เป็นภาษาบนคอมพิวเตอร์รูปแบบหนึ่งใช้สำหรับอธิบายรูปแบบของเอกสาร (Document) ใช้วิธีการ Markup โดยระบุตำแหน่งของข้อมูลในเอกสารนั้น ๆ ว่าจะให้เป็นข้อมูล แบบใด ซึ่งจะใช้ Tag กำกับเข้าไปในเอกสารนั้น เช่น

                

            |                        |                    | 

          Tag                  ข้อความ             Tag          

       

         <H1>      SIAM2WEB       </H1>

 

จากตัวอย่างหมายความว่า  ให้พิมพ์คำว่า SIAM2WEB  ตามรูปแบบ Header 1 

คุณสมบัติของเครื่องที่สามารถนำมาใช้ในการสร้าง Web Page

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

  • ซีพียู (CPU) ไม่ควรต่ำกว่า 80486DX-33 MHz หรือ Pentium ขึ้นไป
  • หน่วยความจำ (Ram) ไม่ควรต่ำกว่า 16 MB
  • การ์ดแสดงผลที่มีความละเอียด (Resolution) 600 x 800 256 สีแบบ VGA ขึ้นไป
  • ฮาร์ดดิสก์ (Hard Disk) ควรใช้อย่างน้อย 500 MB เนื่องจากจะต้องมีการสำรองพื้นที่ไว้สำหรับเก็บไฟล์ข้อมูล,รูปภาพ หรือข้อมูลที่ Download มาจาก Internet
  • ซอฟต์แวร์และยูทิลิตี้ โปรแกรม Browser ต่าง ๆ เช่น Netscape, Internet Explorer (IE), Opera ฯลฯ

โครงสร้างพื้นฐานของ HTML

การเขียน HTML

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

    <tag-name> text </tag-name> 

 

  เป็นชื่อหรือคำสั่งหรือคำต่าง ๆ ที่ใช้กำหนดให้สิ่งที่ตามหลัง tag มีคุณสมบัติตามคำสั่งนั้น tag จะเขียนไว้ใน <...>

text              เป็นข้อความหรืออื่น ๆ ที่จะมีผลตาม tag ที่กำหนด

คำสั่งบอกให้จบ tag โดยจะมีเครื่องหมาย/นำหน้า tag-name

ตัวอย่าง          Welcome to Thailand หรือ  Welcome to Thailand

          <tag-name attribute-name=argument> text </tag-name>

attribute-name     ตัวกำหนดคุณสมบัติต่าง ๆ

argument            คือค่าหรือรูปแบบที่ต้องการ

ตัวอย่าง  <A href="/RedirectExternalUrl?url=test.html"> My First test</A>
ซึ่งหมายความว่าถ้าคลิกข้อความ My First test ก็จะถูกเชื่อมโยงไปที่ไฟล์ test.html ทันที


ภาษา HTML

ความคิดเห็น

ประกาศล่าสุดในบอร์ดเดียวกัน

dreamsweet Icon Photoshop อ่าน 331 14 ปีที่ผ่านมา
14 ปีที่ผ่านมา
dreamsweet Icon ภาษา HTML อ่าน 352 14 ปีที่ผ่านมา
14 ปีที่ผ่านมา
dreamsweet Icon Link Kame Tutor 386 อ่าน 4,304 15 ปีที่ผ่านมา
15 ปีที่ผ่านมา