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

ใบงาน สรุปคำสั่ง HTML

สรุปคำสั่ง HTML

  คำสั่งพื้นฐาน

< !-- ข้อความ -->                           คำสั่ง หมายเหตุ ใช้อธิบายความหมาย ขื่อผู้เขียนโปรแกรม และอื่นๆ
<br>                                         คำสั่งขึ้นบรรทัดใหม่  
<p> ข้อความ </p>                         คำสั่งย่อหน้าใหม่
<hr width = "50%" size = "3">         คำสั่ง ตีเส้น, กำหนดขนาดเส้น
&nbsp;                                      คำสั่ง เพิ่มช่องว่าง
<IMG SRC = "PHOTO.GIF">           คำสั่งแสดงรูปภาพชื่อ Photo.gif
<CENTER> ข้อความ </CENTER>      คำสั่งจัดให้ข้อความอยู่กึ่งกลาง
<HTML> </HTML>                      คำสั่ง <HTML> คือคำสั่งเริ่มต้นในการเขียนโปรแกรม HTML และมีคำสั่ง                                                          </HTML> เพื่อบอกจุดสิ้นสุดโปรแกรม
<HEAD> </HEAD>                      คำสั่ง <HEAD> คือคำสั่งบอกส่วนที่เป็นชื่อเรื่อง โดยมีคำสั่งย่อย <TITLE> อยู่                                                   ภายใน
<TITLE> </TITLE>                      คำสั่ง <TITLE> คือคำสั่งบอกชื่อเรื่อง จะไปปรากฏที่ Title Bar
<BODY> </BODY>                      คำสั่ง <BODY> คือคำสั่งบอกส่วนเนื้อเรื่อง ที่จะถูกแสดงผลในเวปบราวเซอร์                                                       ประกอบด้วยรูปภาพ ตัวอักษร ตาราง เป็นต้น


  รูปแบบตัวอักษร

<font size = "3">                         ข้อความ </font>         ขนาดตัวอักษร
<font color = "red">                     ข้อความ </font>      สีตัวอักษร
<font face = "Arial">                    ข้อความ </font>    รูปแบบตัวอักษร
<besefont size = "2">                   ข้อความ </font>    กำหนดค่าเริ่มต้นของขนาดตัวอักษร
<b> ข้อความ </b>                        ตัวอักษรหนา
<i> ข้อความ </i>                          ตัวอักษรเอน
<u> ข้อความ </u>                        ขีดเส้นใต้ตัวอักษร
<tt> ข้อความ </tt>                       ตัวอักษรแบบพิมพ์ดีด
         
หมายเหตุ เราสามารถใช้คำสั่งกำหนดรูปแบบตัวอักษร หลายๆรูปแบบได้ เช่น
<font face = "Arial" size = "3" color = "red"> ข้อความ </font> เป็นต้น


   การแสดงผลแบบรายการแบบมีหมายเลขกำกับ

<OL value = "1" >
    <LI> รายการที่ 1
    <LI> รายการที่ 2
</OL>
การแสดงผลแบบรายการ ใช้คำสั่ง <OL> เป็นเริ่มและปิดท้ายด้วย </OL> ส่วนคำสั่ง <LI> เป็นตำแหน่งของรายการที่ต้องการนำเสนอ เราสามารถกำหนดให้แสดงผลรายการได้หลายแบบเช่น เรียงลำดับ 1,2,3... หรือ I,II,III... หรือ A,B,C,... ได้ทั้งนี้จะต้องเพิ่มคำสั่งเข้าไปที่ <OL value = "A"> เป็นต้น

    การแสดงผลแบบรายการแบบมีสัญลักษณ์กำกับ

<UL type = "square">
    <LI> รายการที่ 1
    <LI> รายการที่ 2
</UL>

การแสดงผลแบบรายการ ใช้คำสั่ง <UL> เป็นเริ่มและปิดท้ายด้วย </UL> ส่วนคำสั่ง <LI> เป็นตำแหน่งของรายการ ที่ต้องการนำเสนอ เราสามารถกำหนดให้แสดงผลรายการแบบต่างๆ ดังต่อไปนี้
 - รูปวงกลมทึบ "disc"
- รูปวงกลมโปร่ง "circle"
- รูปสี่เหลี่ยม "square"
 ได้ทั้งนี้จะต้องเพิ่มคำสั่งเข้าไปที่ <UL type = "square"> เป็นต้น


คำสั่งแสดงสัญลักษณ์พิเศษต่างๆ

สัญลักษณ์พิเศษบางตัวเช่น เครื่องหมายมากว่า (>) หรือ เครื่องหมายน้อยกว่า (<) ซึ่งเครื่องหมายเหล่านี้ใช้ในภาษา HTML ด้วยทำให้ตัวอักษรที่อยู่ในเครื่องหมายเหล่านี้กลายเป็น Tag หมด หรือเครื่องหมายที่ไม่มีบนคีบอร์ด แต่ถ้าเราต้องการแสดงเครื่องหมายเหล่านี้เราต้องใช้ Entity Name แทน ตามแบบด้านล่าง

Character                            Entity                                                     Name
©                                     &copy;                                             COPYRIGHT SIGN
®                                     &reg;                                              REGISTERED SIGN
™                                    &trade;                                           TRADE MARK SIGN
>                                     &gt;                                            GREATER-THAN SIGN
<                                     &lt;                                                 LESS-THAN SIGN
;                                      &semi;                                               SEMICOLON
&                                    &amp;                                                AMPERSAND
"                                     &quot;                                            QUOTATION MARK
#                                     &num;                                              NUMBER SIGN
                                  &starf;                                                BLACK STAR
                                  &star;                                                 WHITE STAR
                                  &check;                                              CHECK MARK
                                  &cross;                                                 BALLOT X
                                     &nbsp;                                                    SPACE
                                &larr;                                              LEFTWARDS ARROW
                                  &uarr;                                               UPWARDS ARROW
                                &rarr;                                            RIGHTWARDS ARROW
                                  &darr;                                            DOWNWARDS ARROW
€                                   &euro;                                                  EURO SIGN
                                &xdtri;                                 WHITE DOWN-POINTING TRIANGLE
                                 &sum;                                           N-ARY SUMMATION
                                &numero;                                          NUMERO SIGN
                                &copysr;                                  SOUND RECORDING COPYRIGHT

EXAMPLE PICTURE

ผลการค้นหารูปภาพสำหรับ สรุปคำสั่ง HTML













ไม่มีความคิดเห็น:

แสดงความคิดเห็น

ใบงานที่ 2 เรื่อง ตัวอย่างโครงงานคอมพิวเตอร์

ตัวอย่างโครงงานคอมพิวเตอร์ โครงงานพัฒนาสื่อเพื่อการศึกษา (Educational Media)      เป็นโครงงานที่ใช้คอมพิวเตอร์ในการผลิตสื่อเพื่อการศึกษา ...