Nội dung siêu liên kết và hình ảnh trong tài liệu HTML

Nội dung siêu liên kết và hình ảnh trong tài liệu HTML

|
|
424
|

1. Sử dụng siêu liên kết trong tài liệu html

Phần tử Siêu liên kết a là những phần tử bên trong tài liệu được liên kết đến một vị trí xác định trong cùng tài liệu hoặc liên kết đến một trang hoàn toàn khác. Khi ta click chuột vào siêu liên kết, nó sẽ nhảy đến vị trí mà nó liên kết đến.

Siêu liên kết có 2 loại:

  • Liên kết trong: là liên kết đến phần trong cùng tài liệu hoặc cùng website.
  • Liên kết ngoài: là liên kết đến các trang trên các site khác nhau.

Để tạo siêu liên kết, cần xác định hai thành phần:

  • Địa chỉ đầy đủ hoặc URL của file được kết nối.
  • Điểm nóng cung cấp cho liên kết.

Sử dụng siêu liên kết:

Phần tử a được sử dụng để xác định văn bản hay hình ảnh sẽ dùng làm siêu liên kết trong tài liệu HTML. Thuộc tính href (tham chiếu siêu văn bản) được dùng để chỉ ra địa chỉ, URL của tài liệu hay file được liên kết.
Sử dụng siêu liên kết trong tài liệu HTML
Trong đó:
  • Protocol: giao thức sử dụng. Ta có một số loại giao thức như http (truyền siêu văn bản); telnet (mở một phiên telnet); gopher (tìm kiếm file); ftp (giao thức truyền file); mailto (gửi thư điện tử).
  • Host.domain: Địa chỉ Internet của máy chủ.
  • Port: Cổng phục vụ của máy chủ đích.
  • path/filename: Đường dẫn tới file.
  • Hypertext: Văn bản hay hình ảnh mà người dùng cần click vào để kích hoạt liên kết.

Ngoài ra phần tử a còn một số thuộc tính khác như:

coords xác định tọa độ của một liên kết.
title tiêu đề liên kết.
hreflang chỉ định ngôn ngữ của các tài liệu liên quan.
name chỉ định tên của neo trong liên kết đến một điểm xác định của trang.
rel xác định mối quan hệ giữa tài liệu hiện hành và tài liệu liên kết.
rev xác định mối quan hệ giữa các tài liệu liên kết và tài liệu hiện tại.
shape chỉ định hình dạng của một liên kết. Nó có thể nhận giá trị default (mặc định), rect (hình chữ nhật), circle (hình tròn), poly (hình đa giác).
target chỉ định nơi để mở các tài liệu liên kết. Nó có thể nhận giá trị:
 _blank
 _parent
 _self
 _top
 framename

Các hình thức liên kết trong tài liệu HTML:

Liên kết đến một tài liệu khác

- Giả sử ta có hai tài liệu trên đĩa cứng cục bộ doc1.htmldoc2.html. Ta tạo liên kết từ doc1 sang doc2 như sau:
Liên kết đến tài liệu khác trong HTML
- Khi tới tài liệu khác ta nên cung cấp một đường dẫn để quay lại.
- Lưu ý: khi các file ở cùng thư mục ta dùng đường dẫn tương đối, khi ở khác thư mục, ta dùng đường dẫn tuyệt đối.

Sử dụng email và điện thoại

- Liên kết đến ứng dụng gửi email:
Liên kết đến ứng dụng gửi email
- Liên kết đến ứng dụng gọi điện như skype:
Liên kết đến ứng dụng gọi điện
 

Liên kết đến một điễm xác định trong cùng tài liệu

- Khi click vào một đề tài nào đó (Topic name) thì các chi tiết (marker) ở môt phần khác của tài liệu được hiển thị.
Cú pháp:
Vị trí đặt liên kết đến cùng tài liệu
Tại điểm cần liên kết đến ta đặt:
Điểm neo liên kết đến cùng tài liệu

Liên kết đến một điểm xác định ở tài liệu khác

- Khi click vào một đề tài nào đó (Topic name) thì các chi tiết (marker) ở môt phần khác của tài liệu khác được hiển thị.
Cú pháp:
Liên kết đến một vị trí trong trang khác
Tại điểm cần liên kết đến ta đặt ở trang doc2:
Vị trí liên kết trong tài liệu khác

2. Sử dụng hình ảnh trong tài liệu html

Để hiển thị hình ảnh trên trang, ta dùng phần tử img, kèm theo các thuộc tính src để chỉ ra đường dẫn hình ảnh và alt để mô tả hình ảnh.
Sử dụng hình ảnh trong tài liệu HTML

Sử dụng bản đồ hình ảnh trong tài liệu HTML:

Bản đồ hình ảnh là hình ảnh trong đó các vùng khác nhau hoạt động như các liên kết. HTML cung cấp 3 phần tử để tạo một bản đồ hình ảnh.
- Phần tử map xác định bản đồ hình ảnh. Nó cung cấp thuộc tính name để chỉ rõ tên của bản đồ hình ảnh.
- Phần tử area chỉ rõ tọa độ ở khu vực bên trong hình ảnh sẽ hoạt động như một siêu liên kết và hình dạng của bản đồ hình ảnh. Nó có các thuộc tính:
alt chỉ rõ văn bản được thay thế nếu bản đồ hình ảnh không xuất hiện.
href chỉ rõ url của trang cần liên kết đến trong bản đồ ảnh.
shape chỉ ra hình dạng có thể chọn. Nó có thể nhận giá trị:
default mặc định circle hình tròn
rect hình chữ nhật poly hình đa giác
coords chỉ ra tọa độ của khu vực có thể bấm, nó phụ thuộc vào hình dạng được chỉ ra cho bản đồ hình ảnh.
center_x, center_y, radius Hình tròn
left_x, top_y, right_x, bottom_y Hình chữ nhật
tùy chọn Đa giác
target chỉ ra nơi liên kết được mở.
- Phần tử img:  chọn ảnh làm bản đồ ảnh. Nó gồm các thuộc tính:
src chỉ ra đường dẫn đến hình ảnh.
alt văn bản thay thế hình ảnh khi không xuất hiện.
usermap nói đến tên bản đồ hình ảnh.
align canh lề cho hình ảnh.
border chiều rộng đường viền bao quanh hình ảnh.
width xác định chiều rộng hình ảnh.
height xác định chiều cao hình ảnh.
hspace xác định khoảng trắng bên phải và bên trái của hình ảnh.
vspace xác định khoảng trắng bên trên và bên dưới của hình ảnh.
ismap chỉ định kết nối đến một hình ảnh như một bản đồ hình ảnh phía máy chủ. Nó nhận giá trị ismap.
longdesc chỉ định url của một hình ành chứa mô tả về hình ảnh.

Bạn có thể quan tâm

  • logo Lighhouse Corp
  • logo Khách sạn Bamboo Greenlogo Toyota Đà Nẵng
  • logo Vé máy bay AGOZ
  • logo PangPang Tour
  • logo Memory Hostel
  • logo Bất động sản Danang Land
  • logo Nhôm kính Dana Door