คำสั่งต่าง ๆ ในภาษา html
|
ลำดับ
|
รูปแบบคำสั่ง
|
ความหมาย
|
1.
| <H..> message </H..> | การกำหนดหัวเรื่อง |
2
| <BR> | ขึ้นบรรทัดใหม่ |
3.
| <P> message </P> | ขึ้นย่อหน้าใหม่ |
4.
| <blockquote> message </blockquote> | บล็อคข้อความ |
5.
| <CENTER> message </CENTER> | จัดให้อยู่กึ่งกลาง |
6.
| <HR> | การสร้างเส้นในเอกสาร |
7.
| <B> message </B> | ตัวอักษรหนา |
8.
| <I> message </I> | อักษรเอียง |
9.
| <U> message </U> | ขีดเส้นใต้ |
10.
| <TT> message </TT> | ตัวพิมพ์ดีด |
11.
| <S> message </S> | มีเส้นพาดกลางข้อความตัวอักษร |
12.
| <BLINK> message </BLINK> | ตัวอักษรกระพริบ |
13
| <Address> message </Address> | อักษรกี่ยวกับ E-mail เลขโทรศัพท์ |
14.
| <BIG> message </BIG> | อักษรตัวโต |
15.
| < SMALLP> message </SMALL> | อักษรตัวเล็ก |
16.
| <VAR> message </VAR> | รูปแบบข้อความ,ค่าตัวเลข |
17.
| <Font color= colormane> | การกำหนดสีให้กับตัวอักษร (Color) |
18.
| <Font Text= colormane> | กำหนดสีให้กับตัวอักษรทั้งเอกสาร |
19.
| <MARQUEE> message </MARQUEE> | การสร้างอักษรวิ่ง |
20.
| <Font Size= n> message </Font> | กำหนดขนาดตัวอักษรโดยใช้เลข (1-7) |
คำสั่ง ต่าง ๆ ในการสร้างเว็บเพจด้วยภาษา HTML
1. การกำหนดข้อความลงใน Title bar <title> ข้อความที่ต้องการให้ปรากฏลงบน Title Bar </title>
2. การกำหนดขนาดของหัวเรื่อง มีอยู่ 6 ระดับ คือ H1, H2, H3, H4, H5 และ H6 โดยจะเรียงจากขนาดใหญ่ไปหาเล็ก
1. การกำหนดข้อความลงใน Title bar <title> ข้อความที่ต้องการให้ปรากฏลงบน Title Bar </title>
2. การกำหนดขนาดของหัวเรื่อง มีอยู่ 6 ระดับ คือ H1, H2, H3, H4, H5 และ H6 โดยจะเรียงจากขนาดใหญ่ไปหาเล็ก
| H1 | จะมีขนาด 21 pixel และตัวหนา |
| H2 | จะมีขนาด 17 pixel และตัวหนา |
| H3 | จะมีขนาด 14 pixel และตัวหนา |
| H4 | จะมีขนาด 12 pixel และตัวหนา |
| H5 | จะมีขนาด 11 pixel และตัวหนา |
| H6 | จะมีขนาด 9 pixel และตัวหนา |
เช่น
| <Html> | จะได้ |
| <Body> | |
| <H1> H1 </H1> |
H1
|
| <H2> H2 </H2> |
H2
|
| <H3> H3 </H3> |
H3
|
| <H4> H4 </H4> |
H4
|
| <H5> H5 </H5> |
H5
|
| <H6> H6 </H6> |
H6
|
| </Body> | |
| </Html> |
3. การกำหนด background
<body bgcolor="color">
การกำหนดสีของ background ทำได้โดยการเพิ่มคำสั่ง bgcolor ลงใน <body> color คือ ชื่อสีหรือcode สีที่จะใช้กำหนดสีของ background ชื่อสีเช่น black white blue green red ฯลฯ Code สี คือเลขฐาน16 คือ (0-9,A-F) 6 ตัวซึ่งแทนค่าในสีต่าง ๆ 2 ตัวแรกจะแทนค่าสีแดง 2 ตัวกลางจะแทนสีเขียว ส่วน 2 ตัวหลังจะแทนสีน้ำเงิน
4. การใช้ภาพเป็น Background
<body background="URL">
5. การใส่ข้อความ (Font)
<Font> ....... </Font>
ขนาดตัวอักษร จะมีขนาด -1ถึง+7 โดยเลข -1 จะเล็กที่สุด และ +7 จะมีขนาดใหญ่ที่สุด
ดังตัวอย่างขนาดตัวอักษร 1 - 7
size=1 จะมีขนาด 8 pixel
size=2 จะมีขนาด 10 pixel
size=3 จะมีขนาด 12 pixel
size=4 จะมีขนาด 14 pixel
size=5 จะมีขนาด 18 pixel
size=6 จะมีขนาด 24 pixel
size=7 จะมีขนาด 36 pixel
เช่น
<body bgcolor="color">
การกำหนดสีของ background ทำได้โดยการเพิ่มคำสั่ง bgcolor ลงใน <body> color คือ ชื่อสีหรือcode สีที่จะใช้กำหนดสีของ background ชื่อสีเช่น black white blue green red ฯลฯ Code สี คือเลขฐาน16 คือ (0-9,A-F) 6 ตัวซึ่งแทนค่าในสีต่าง ๆ 2 ตัวแรกจะแทนค่าสีแดง 2 ตัวกลางจะแทนสีเขียว ส่วน 2 ตัวหลังจะแทนสีน้ำเงิน
4. การใช้ภาพเป็น Background
<body background="URL">
5. การใส่ข้อความ (Font)
<Font> ....... </Font>
ขนาดตัวอักษร จะมีขนาด -1ถึง+7 โดยเลข -1 จะเล็กที่สุด และ +7 จะมีขนาดใหญ่ที่สุด
ดังตัวอย่างขนาดตัวอักษร 1 - 7
size=1 จะมีขนาด 8 pixel
size=2 จะมีขนาด 10 pixel
size=3 จะมีขนาด 12 pixel
size=4 จะมีขนาด 14 pixel
size=5 จะมีขนาด 18 pixel
size=6 จะมีขนาด 24 pixel
size=7 จะมีขนาด 36 pixel
เช่น
<font size=7>size=7</font> <font size=6>size=6</font> <font size=5>size=5</font> <font size=4>size=4</font> <font size=3>size=3</font> <font size=2>size=2</font> <font size=1>size=1</font> <font size=0>size=0</font> | size=7 size=6 size=5 size=4 size=3 size=2 size=1 size=0 |
คำสั่ง font นี้นอกจากจะสามารถกำหนดขนาดของตัวอักษรได้แล้ว ยังสามารถใช้ในการกำหนดสีสันให้กับตัวอักษรได้อีกด้วย ซึ่งจะใช้ คำสั่ง color="สีที่ต้องการ" ในการกำหนดสี ซึ่งสีที่ต้องการนี้ เราสามารถกำหนดออกมาเป็นชื่อของสีตรงๆ หรือว่าจะใช้ รหัสของสี ก็ได้ โดยรหัสของสีนี้จะเป็นเลขฐาน 16 จำนวน 6 หลัก ซึ่งการใช้รหัสของสีจะช่วยให้เราสามารถ กำหนดสีได้มากกว่าการอ้างถึงชื่อของสีโดยตรง เช่น
| <font color="#000FFF">color="#000FFF"</font> <font color="red">color="red"</font> |
color="#000FFF"
color="red" |
การใส่ข้อความลงในโฮมเพจสามารถใส่ลงไประหว่าง <body> .... </body> ได้เลย ตัวอย่างเช่น
<body>
การสร้างเว็บเพจของผม จัดทำเรื่อง แหล่งท่องเที่ยวจังหวัดนครราชสีมา
</body>
6. คำสั่งขึ้นบรรทัดใหม่
คำสั่งสำหรับขึ้นบรรทัดใหม่ใช้คำสั่ง <br> วางไว้ท้ายข้อความที่ต้องการ ตัวอย่างเช่น
<body>
HTML<br>
Java script<br>
Java applet<br>
</body>
7. การกำหนดสีของเส้นคั่น (เฉพาะ IE) <hr color="Code สี">
ทำได้โดยการเติม code สีที่ต้องการลงไปได้เลย Code สี
ตัวอย่าง เช่น <hr noshade size="10" align="center" color="cc66cc">
8. การกำหนดตัวเอียง ตัวหนา และ ตัวขีดเส้นใต้
<b> = ตัวหนา
<i> = ตัวเอียง
<u> = ตัวขีดเส้นใต้
<b>HTML</b><br>
<i>HTML</i><br>
<u>HTML</u><br>
9. การจัดหน้ากระดาษ
<center> text </center>
<center> ใช้สำหรับ จัดกึ่งกลางหน้ากระดาษ
10. การย่อหน้า
<Pre> ....... </Pre>
เป็นคำสั่งที่ใช้ในการกำหนดให้ข้อความอยู่ในย่อหน้าตามที่เรากำหนด
11. คำสั่งการจัดการเกี่ยวกับรูปภาพ
เราจะใช้คำสั่ง <Img src="ชื่อไฟล์"> ซึ่งจะมีตัวช่วยในการจัดรูปแบบเพิ่มเติม ดังนี้
<body>
การสร้างเว็บเพจของผม จัดทำเรื่อง แหล่งท่องเที่ยวจังหวัดนครราชสีมา
</body>
6. คำสั่งขึ้นบรรทัดใหม่
คำสั่งสำหรับขึ้นบรรทัดใหม่ใช้คำสั่ง <br> วางไว้ท้ายข้อความที่ต้องการ ตัวอย่างเช่น
<body>
HTML<br>
Java script<br>
Java applet<br>
</body>
7. การกำหนดสีของเส้นคั่น (เฉพาะ IE) <hr color="Code สี">
ทำได้โดยการเติม code สีที่ต้องการลงไปได้เลย Code สี
ตัวอย่าง เช่น <hr noshade size="10" align="center" color="cc66cc">
8. การกำหนดตัวเอียง ตัวหนา และ ตัวขีดเส้นใต้
<b> = ตัวหนา
<i> = ตัวเอียง
<u> = ตัวขีดเส้นใต้
<b>HTML</b><br>
<i>HTML</i><br>
<u>HTML</u><br>
9. การจัดหน้ากระดาษ
<center> text </center>
<center> ใช้สำหรับ จัดกึ่งกลางหน้ากระดาษ
10. การย่อหน้า
<Pre> ....... </Pre>
เป็นคำสั่งที่ใช้ในการกำหนดให้ข้อความอยู่ในย่อหน้าตามที่เรากำหนด
11. คำสั่งการจัดการเกี่ยวกับรูปภาพ
เราจะใช้คำสั่ง <Img src="ชื่อไฟล์"> ซึ่งจะมีตัวช่วยในการจัดรูปแบบเพิ่มเติม ดังนี้
- ALIGN ใช้กำหนดตำแหน่งการจัดวางของรูปภาพ
- ALIGN=TOP วางส่วนบนของรูปภาพไว้ที่ baseline ของบรรทัด
- ALIGN=LEFT วางตำแหน่งของรูปภาพ ไว้ที่ด้านซ้ายของเอกสาร
- ALIGN=RIGHT วางตำแหน่งของรูปภาพไว้ที่ด้านขวาของเอกสาร
- ALIGN=MIDDLE วางส่วนกลางของรูปภาพไว้ที่ baseline ของบรรทัด
- ALIGN=BOTTOM วางส่วนล่างของรูปภาพไว้ที่ baseline ของบรรทัด
- WIDTH จะใช้ในการกำหนดความกว้างของรูปภาพ
- HEIGHT ใช้ในการกำหนดความสูงของรูปภาพ
- BORDER ใช้กำหนดการแสดงเส้นขอบรูป
- VSPACE ใช้กำหนดระยะห่างทางด้านบน, ล่าง
- HSPACE ใช้กำหนดระยะห่างทางด้านซ้าย, ขวา
12. การเชื่อมโยงข้อมูลบนโฮมเพจ
การเชื่อมโยงข้อมูล ถูกกำหนดขึ้นด้วยชุดคำสั่ง A (Anchor) การแทรกชุดคำสั่ง A จะเป็น
การแจ้งให้ browser ทราบว่าส่วนดังกล่าว เป็นจุดเชื่อมโยงข้อมูล ชุดคำสั่ง A จะต้องใช้ร่วมกับ HREF หรือ NAME เสมอ โดย
<A HREF="xxxx"> จะใช้เพื่อบอกว่าจะเชื่อมต่อไปที่ใด
<A NAME="xxxx"> ทำหน้าที่เป็นตำแหน่งอ้างถึงบนเอกสาร
โครงสร้างของ HTML จะเป็นดังนี้
<A HREF="เป้าหมายที่จะไป">สิ่งที่ถูกกำหนดให้เป็น link</A>
คือ สิ่งที่จะถูกกำหนดให้เป็น link ซึ่งเป็นได้ทั้งข้อความ และรูปภาพ หากมีการระบุให้เป็น link แล้ว เมื่อนำเมาส์ไปชี้บน link นั้น สัญลักษณ์เมาส์จะเปลี่ยนเป็นรูปมือชี้ หากจุด link เป็นข้อความ ก็จะเห็นข้อความมีขีดเส้นใต้ด้วย
การเชื่อมโยงข้อมูล ถูกกำหนดขึ้นด้วยชุดคำสั่ง A (Anchor) การแทรกชุดคำสั่ง A จะเป็น
การแจ้งให้ browser ทราบว่าส่วนดังกล่าว เป็นจุดเชื่อมโยงข้อมูล ชุดคำสั่ง A จะต้องใช้ร่วมกับ HREF หรือ NAME เสมอ โดย
<A HREF="xxxx"> จะใช้เพื่อบอกว่าจะเชื่อมต่อไปที่ใด
<A NAME="xxxx"> ทำหน้าที่เป็นตำแหน่งอ้างถึงบนเอกสาร
โครงสร้างของ HTML จะเป็นดังนี้
<A HREF="เป้าหมายที่จะไป">สิ่งที่ถูกกำหนดให้เป็น link</A>
คือ สิ่งที่จะถูกกำหนดให้เป็น link ซึ่งเป็นได้ทั้งข้อความ และรูปภาพ หากมีการระบุให้เป็น link แล้ว เมื่อนำเมาส์ไปชี้บน link นั้น สัญลักษณ์เมาส์จะเปลี่ยนเป็นรูปมือชี้ หากจุด link เป็นข้อความ ก็จะเห็นข้อความมีขีดเส้นใต้ด้วย
