Ngôn ngữ HTML - Thiết lập liên kết

THIẾT LẬP LIÊN KẾT TRONG HTML


1. Khái quát

  • Các siêu liên kết (Hyper Link) là cốt lõi của tập tin HTML cho phép truy cập đến các trang khác trên cùng máy tính hay ở máy tính khác.
  • Tài liệu liên kết có thể là các tập tin: Hình ảnh, âm thanh, Multimedia, HTML . . .
  • Khi Click vào liên kết sự truy cập  tại địa chỉ truy cập sẽ thực hiện tự động 

2. Liên kết cục bộ (Local Link)
Là liên kết đến các tài liệu Trên cùng máy . 

Cú pháp:

<A HREF ="Địa chỉ liên kết">  Nhãn liên kết </A>


Ví dụ:   

 <A HREF ="/Htmls/Gioithieu.htm">  Giới thiệu</A>

Đến 1 vị trí trên cùng trang Web

Cú pháp:

<A HREF ="#Tên đích >  Nhãn liên kết </A>
    Khai báo đích đến: 
<A NAME ="Tên đích"> . . . </A>

Ghi chú: Tên đích ở bất cứ vị trí nào trên cùng tập tin.

Ví dụ : Tạo trang web có nội dung sau:

<HTML>
<HEAD><TITLE>  </TITLE></HEAD>
<BODY Background="images/bg.jpg" Bgproperties =Fixed>
	<a Name="#Dau"><H3 Align="center">CHƯƠNG TRÌNH ĐÀO TẠO</H3></a>
	 1.Kỹ thuật viên tin học<BR>
	<a Href="vidu13.html"> 
	2. Chuyên ngành website </a>	<HR>
	 <Font Size=4 Color=Red>Kỹ thuật viên tin học </Font><BR> 
	<a Href="#HP1"> Học phần I </a><BR>
	<a Href="#HP2"> Học phần II </a><BR>
	<a Href="#HP3"> Học phần III </a>	
	<ol Type="I">
	    <a Name="#HP1">
	    <li> Tin Học Căn Bản
            <ol>
                <li>Tổng quan cấu trúc máy tính</li>
                <li>Hệ điều hành Windows &amp;Internet</li>
            </ol>
         </li>
         </a>
    
	    <a Name="#HP2">
	    <li> Tin Học Văn Phòng
		<ol>
			<li> Microsoft Word</li>
			<li> MicroSoft Excel</li>
		</ol>
        </li>
        </a>
        
	    <a Name="#HP3">	    
<li>Tin Học Quản Lý 
		<ol>
			<li> Microsoft Access </li>
			<li> MicroSoft PowerPoint</li>
		</ol>
        </li>
        </a>
	</ol></P>
	<P align=Right><a Href="#Dau">Đầu trang </a></P>
</BODY>
</HTML> 

Xem ví dụ

3. Liên kết từ xa(Remote Link)
Là liên kết đến tài liệu lưu trữ trên máy khác. 
Liên kết đến 1 địa chỉ URL

Cú pháp
<A HREF ="http://URL">  Nhãn liên kết </A>

Ví dụ:   

 <a href="http://www.vietnamnet.vn"> Website tin tức việt nam</a> 

Xem ví dụ

Liên kết đến 1 địa chỉ Email
<A HREF ="Mailto: Địa chỉ Email">Nhãn liên kết </A>
Ví dụ:   

 <a href="Mailto:vinhnguyen208@gmail.com">  Gởi Mail cho tôi </a>

Xem ví dụ

Sẽ mở chương trình mail mặc định để soạn và gửi thư.
4. Dùng hình ảnh làm nhãn liên kết.

Cú pháp:

<a href="http://URL"><img src="Tập tin ảnh"></a>


Ví dụ:   

 <a href ="http://www.vietnamnet.vn"> <img Src=images/vietnamnet.jpg> </a>

Xem ví dụ

5. Mở liên kết với thuộc tính "target".
 

Thuộc tính Giải thích
target="_blank" Mở một window mới
target="_parent" Mở một liên kết trong Frame
target="_self" Mở một trang trong cùng window
target="_top" Mở một trang mới trong cùng một trình duyệt hủy bỏ tất cả các Frame

Mặc định các liên kết được mở trên cửa sổ hiện tại. Để  mở 1 cửa sổ riêng thì sử dụng:
Cú pháp:

<a href=. . . .  target="_Blank">Nhãn liên kết </a>

Ví dụ:

<a href="http://www.vietnamnet.vn"  targer="_Blank" > 
<img src=images/vietnamnet.jpg> </a>

Xem ví dụ

Ví dụ: Tạo tập tin HTM với nội dung như sau
 

<HTML>
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<TITLE> Hiep sĩ IT demo các thiết lập liên kết</TITLE>
</HEAD>
<BODY Background ="images/bg.jpg" bgproperties=Fixed Link="Black" link="Blue"> 
    <p align="center">
          <font Size=4 color="blue"> <B>DANH BẠ WEBSITE</B> </Font>
    </P>
    <dl>
         <dt><B>Tin Tức</B>
	  <dd><a href="http://www.vietnamnet.vn"> Tin tức việt nam</A>
	   <dd> <a href="http://www.Tuoitre.com.vn"> Báo tuổi trẻ</A>
          <dt> <B>Giải trí</B>
	   <dd> <a href="http://www.nhacso.net"   target="_balnk"> Nhạc số Online</A>
	   <dd> <a href="http://www.ngoisao.net"    target="_balnk">Giới thiệu ngôi sao</A>
          </dl>
<B>Liên kết quảng cáo</B><BR>
    <a href="http://www.echip.com.vn" target="_balnk"> 
      <img Src="images/echip.png" width="130" heigh="60"> </A>
    <a href="http://www.vietnamnet.vn" target="_balnk">
      <img Src="images/vietnamnet.png" width="130" heigh="60"></A><HR>
    Liên hệ:<a href="Mailto:info@hiepsiit.com">Gởi mail </A>
</BODY>
</HTML>

Xem ví dụ

6. Tạo liên kết cho tập tin Media 
<a href="Tên tập tin Media"  target=_blank> Nhãn liên kết </A>
Nhãn liên kết: văn bản hoặc hình ảnh
target=_blank: Mở cửa sổ riêng.

Ví dụ:

<HTML>
<HEAD><TITLE> </TITLE></HEAD>
<Body>
<H3> Nhạc Onlie</H3>
<a href="demchiaxa.mp3"   target="_blank"> Đêm chia xa </a><br/>
<a href="chieuvan.mp3">Chiều vắng</a> 
<Body>
</HTML>

Xem ví dụ

7. Liên kết DownLoad
Để tạo liên kết Download tài liệu: Ta chuyển tài liệu thành các dạng tập tin Zip,Rar, pdf, .doc . . .  sau đó tạo liên kết  đến các tập tin này.