ทำแบบทดสอบก่อนเรียน
การออกแบบเว็บไซต์
ภาษา html
การจัดรูปแบบเอกสาร
การจัดรูปแบบตัวอักษร
การใส่รูปภาพลงในเว็บเพจ
การสร้างตาราง
การเชื่อมโยงเว็บเพจ
การใส่ไฟล์มัลติมีเดีย
แบบทดสอบหลังเรียน


    3.2 การสร้างจุดเชื่อมโยงให้กับรูปภาพ (Graphic Link)
          เป็นกำหนดให้รูปภาพใดๆ ที่เป็นการใช้จุดเชื่อมโยง

รูปแบบ        


<a href = URL><img src ="ชื่อไฟล์รูปภาพ"> < /a>

ตัวอย่างการสร้างจุดเชื่อมโยง

<!DOCTYPE  html>
<html>
<head>
<title> Anchor Tag </title>
</head>
<body>

<a href="http://www.kruitti.com><img src="logo.jpg"></a><br>
<a href="http://www.kruitti.com">บทเรียนออนไลน์ผ่านระบบเครือข่าย</a>

</body>
</html>


4. ลักษณะการเชื่อมโยงไปยังตำแหน่งต่างๆ
     เราสามารถกำหนดการเชื่อโยงไปยังตำแหน่งต่างๆ ได้หลายแบบด้วยกันคือ
     1. การเชื่อโยงภายในเว็บเพจเดียวกัน
     2. การเชื่อมโยงไปยังเว็บเพจอื่นในเว็บไซต์เดียวกัน
     3. การเชื่อมโยงไปยังเว็บไซต์
     4. การเชื่อมโยงไปยังอีเมล (Email link)
     5. การเชื่อมโยงไปยังไฟล์ดาวน์โลด

     4.1 การเชื่อมโยงภายในเว็บเพจเดียวกัน
            การเชื่อมโยงลักษณะนี้ จะมีกาจัดวางจุดเชื่อมโยงและเป้าหมายอยู่ภายในเว็บเพจเดียวกันดังรูป
กำหนดเป้าหมาย

รูปแบบ

<a name ="ชื่อเป้าหมาย"> ข้อความที่ต้องการแสดง </a>

ชื่อเป้าหมาย (Target)  เป็นชื่อของตำแหน่งจุดเชื่อมโยงที่ตั้งไว้ข้างต้น เป็นจุดหมายที่ต้องการเชื่อมโยง
ไปถึงกำหนดจุดเชื่อมโยง

<a href =#ชื่อจุดเชื่อมโยง"> ข้อความที่เป็นจุดเชื่อมโยง</a>

ชื่อจุดเชื่อมโยง (link)  เป็นชื่อของตำแหน่งในเอกาสาร ที่ใช้เป็นจุดเชื่อมโยงไปยังเนื้อความอื่นๆ ต้องนำหน้าด้วยเครื่องหมาย #

สิ่งที่ควรระวังคือ     ชื่อจุดเชื่อมโยงและเป้าหมายต้องเป็นชื่อเดียวกัน


ตัวอย่างการเชื่อมโยงภายในเว็บเพจเดียวกัน

Glossary
B C
A
Absolute path paths contain a complete address that anyone could use to get to a web page
Alignment The horizontal placement of a paragraph, specified by using the text-align attribute.
Anchor A marker within an HTML document, roughly analogous to a bookmark in a Microsoft Word document.

Background image An image that appears behind the text on a Wed page. By default, the image is tiled to fill the page ,and scroll with the page.
Baseline The imaginary line on which text rests
Body The section of an HTML document defined by the two-sided tag. It contains all the information that appears in the Wed browser when the page is viewed

Cascading style sheet A document that specifies formatting for particular tags and then can be applied to multiple Wed pages.
Cell A distinct area of a table, into which you can place text, graphics, or even other tables A subfolder of a parent folder


จะเขียนเว็บเพจได้ดังนี้


<!DOCTYPE  html>
<html>
<head>
<title> Anchor Tag </title>
</head>
<body>
<h3>Glossary</h3>
<p> A
<a href="#sectionB">B</a>
C
</p>
<p><h3>A</h3>B</a>
<b>a bsoult path</b> paths that contain a complete address that anyone could use to a Wed page<br><br>
<b>alignment</b> The horizontal placement of a paragraph, specified by using the text-align attribute . <br><br>
<b> anchor </b> A marker within an HTML document, roughly analogous to a bookmark in a Microsoft Word document.
</p>
<p><a name="section B “><h3> B</h3></a>
<b>background image </b> An image that appears behind the text on a Web page by default, the image is  tiled to fill the page, and scrolls with the page
<br><br>
<b> baseline </b> the imaginary line on which text rehth. <br><br>
<b> body </b> the section of an HTML document defined by the two-sided
<body> tag .It contains all the information that appears in the Web browser
When the page is viewed.
</p>
<p><h3>C</h3></a>
<b>cascading style sheet</b> A document that specifies formatting for particular tags and can be applied to multiple Web pages.<br><br>
<b>cell</b>A distinct area of a table, into which you can place text, graphics,or even other tables. Child folder A subfolder of a parent folder.
</p>
</body>
</html>