|
|
คัมภีร์พื้นฐานลมปราณ HTML |
คำสั่งจัดการเกี่ยวกับการสร้างสิสต์รายการ
1. <UL >......</UL > เป็นคำสั่งที่ใช้แสดงลิสต์รายการโดยมีสัญลักษณ์หน้ารายการ ตัวอย่าง
<UL >
<LI > Kongmemories เว็บ JK!
<LI > Aungkingdom เว็บนายอ๋อง
<LI > Thaidet เว็บนายพี
</UL >
ซึ่งจะแสดงผลหน้าจอดังต่อไปนี้
- Kongmemories เว็บ JK!
- Aungkingdom เว็บนายอ๋อง
- Thaidet เว็บนายพี
2. <OL >......</OL > เป็นคำสั่งที่ใช้แสดงลิสต์รายการแบบเรียงลำดับโดยมี ตัวเลข หรืออักษรแสดงลำดับ ตัวอย่าง
<OL >
<LI > Kongmemories เว็บ JK!
<LI > Aungkingdom เว็บนายอ๋อง
<LI > Thaidet เว็บนายพี
</OL >
ซึ่งจะแสดงผลหน้าจอดังต่อไปนี้
- Kongmemories เว็บ JK!
- Aungkingdom เว็บนายอ๋อง
- Thaidet เว็บนายพี
3. <DL ><DT > ......<DD > </DL > เป็นคำสั่งที่ใช้แสดงลิสต์รายการโดยจัดย่อหน้าเอกสารเป็น หัวเรื่องหลักและหัวเรื่องย่อยโดยคำสั่งจะอยู่ในแท็ก <DL > ...... </DL> ซึ่ง
<DT > ใช้กับการแสดงหัวเรื่องหลัก
<DD > ใช้กับการแสดงหัวเรื่องย่อย ตัวอย่าง
<DL >
<DT > เรื่องของเว็บ
<DD > Kongmemories
<DD > Aungkingdom
<DD > Thaidet
<DT > Webmaster
<DD > เว็บ JK!
<DD > เว็บนายอ๋อง
<DD > เว็บนายพี
</DL >
ซึ่งจะแสดงผลหน้าจอดังต่อไปนี้
- เรื่องของเว็บ
- Kongmemories
- Aungkingdom
- Thaidet
- Webmaster
- เว็บ JK!
- เว็บนายอ๋อง
- เว็บนายพี
คำสั่งในการจัดการการเชื่อมโยงข้อมูลบนเว็บเพจ
1. การเชื่อมโยงข้อมูลภายในเว็บเพจเดียวกัน
ใช้คำสั่ง <A HREF=#ชื่อตำแหน่งข้อมูลที่ต้องการ >......</A > ซึ่งชื่อตำแหน่งข้อมูลกำหนดได้โดยใช้คำสั่ง<A HREF=ชื่อตำแหน่งข้อมูล>
ใช้ในกรณีที่เว็บเพจหนึ่งหน้ามีความยาวมาก เมื่อผู้เข้าชมเว็บต้องการค้นหาข้อมูลเรื่องใดเรื่องหนึ่งโดยเฉพาะในหน้าเว็บนั้น ก็สามารถเข้าถึงได้ทันทีจากการคลิ๊กที่หัวข้อนั้น ๆ
ตัวอย่าง
ได้มีการกำหนดคำสั่ง <A name="#list" > ไว้ ณ ตำแหน่งหัวข้อ "คำสั่งจัดการเกี่ยวกับการสร้างสิสต์รายการ"
และมีการพิมพ์คำสั่งดังนี้ในเอกสาร HTML
<A HREF="#list" >คำสั่งจัดการเกี่ยวกับการสร้างสิสต์รายการ(คลิกที่นี่)</A >
ซึ่งจะแสดงผลหน้าจอดังต่อไปนี้
คำสั่งจัดการเกี่ยวกับการสร้างสิสต์รายการ(คลิกที่นี่)
2. การเชื่อมโยงข้อมูลภายในเว็บเพจอื่นในไดเรคทอรี่เดียวกันเดียวกัน
ใช้คำสั่ง <A HREF="ชื่อไฟล์" >......</A >
ตัวอย่าง
<DL >
<DT > คนทำเว็บ
<DD > <A HREF="htmltuter.html" >เรียนรู้ HTML พื้นฐาน กะ JK! เดนเวอร์ </A >
<DD > <A HREF="htmltuter2.html์" >เรียนรู้ HTML พื้นฐาน ตอน 2 กะเจไดก้อง </A >
</DL >
ซึ่งจะแสดงผลหน้าจอดังต่อไปนี้
- คนทำเว็บ
- เรียนรู้ HTML พื้นฐาน กะ JK! เดนเวอร์
- เรียนรู้ HTML พื้นฐาน ตอน 2 กะเจไดก้อง
3. การเชื่อมโยงข้อมูลไปยังเว็บเพจในไดเรคทอรี่อื่นภายในไซต์เดียวกัน สามารถทำได้โดยระบุไดเรคทอรี่ที่ต้องการโดยใช้ /แทนการอ้างอิงระดับชั้นไดเรคทอรี่ และ ../ แทนการอ้างอิงไดเรคทอรี่ชั้นก่อนหน้า
ใช้คำสั่ง <A HREF="ชื่อไฟล์" >......</A >
ตัวอย่าง
<DL >
<DT > Link ข้ามไดเรคทอรี่
<DD > <A href="pictures/ufogellery.html" >ห้องภาพจานบินและมนุษย์ต่างดาว </A >
</DL >
ซึ่งจะแสดงผลหน้าจอดังต่อไปนี้
- Link ข้ามไดเรคทอรี่
- ห้องภาพจานบินและมนุษย์ต่างดาว
4. การเชื่อมโยงข้อมูลไปยังโฮมเพจอื่น ใช้เพื่อเชื่อมโยงไปยังเว็บไซต์อื่นหรือหน้าเว็บเพจอื่นที่ไม่ได้อยู่บนโฮมเพจของเรา
ใช้คำสั่ง <A HREF="ชื่อไฟล์" >......</A >
ตัวอย่าง
<UL >
<LI > <A href="http://www.thai.net/janieclub/" >เจนี่คลับ เว็บลุงนู้น</A >
<LI > <A href="http://www.thaibros.com" >Aungkingdom เว็บนายอ๋อง</A >
<LI > <A href="http://www.thaidet.cjb.net/" >Thaidet เว็บนายพี</A >
</UL >
ซึ่งจะแสดงผลหน้าจอดังต่อไปนี้
5. เราสามารถกำหนดการเชื่อมโยงข้อมูลได้ทั้งจากตัวอักษร หรือจากรูปภาพสัญลักษณ์ โดยแทนที่ตำแหน่งตัวอักษรแทนรูปภาพ
มีรูปแบบดังนี้ <A HREF="ชื่อไฟล์" ><IMG SRC="ไฟล์รูปภาพ" ALT= "ข้อความ"></A >
ตัวอย่าง
<Center>
<A href="http://www.thai.net/janieclub/" ><IMG SRC="http://www.thai.net/methipat/images/janie.jpg" ALT= "เจนี่คลับ เว็บลุงนู้น"></A >
<A href="http://www.thaibros.com" ><IMG SRC="http://www.thai.net/methipat/images/aung.gif" ALT= "Aungkingdom เว็บนายอ๋อง"></A >
<A href="http://www.thaidet.cjb.net/" ><IMG SRC="http://www.thai.net/methipat/images/tdet.gif" ALT= "Thaidet เว็บนายพี"></A >
</Center>
ซึ่งจะแสดงผลหน้าจอดังต่อไปนี้
เราสามารถกำหนดสีของลิงค์ได้ตามต้องการ โดยการเพิ่มคำสั่ง เข้าไปในแท็ก <BODY>
โดย Link=ค่าสี ใช้กำหนดสีของข้อความของลิงค์ที่ไม่เคยถูกคลิก
Vlink=ค่าสี ใช้กำหนดสีของข้อความของลิงค์ที่เคยถูกคลิกแล้ว
ตัวอย่าง
<BODY LINK="#003399" Vlink ="#3300ff "> ........</BODY>
หากไม่มีการกำหนดค่ามาตรฐานของสีของ Link คือสีน้ำเงิน Vlink คือสีม่วง
พื้นฐาน HTML ตอนที่ 4
ขอพลังจงอยู่กับท่าน
ขอพลังจงอยู่กับท่าน
|
|
|
|
|
|