Bài giảng Thiết kế Web tĩnh - Phần 1: Ngôn ngữ HTML - Chương 5: Frame

Khi cần hiển thị trên trình duyệt nhiều nội dung, chủ đề

khác nhau trên cùng một trang thì một giải pháp có thể

đáp ứng cho trường hợp này là frame (khung).

 Có thể phân chia một trang thành các khung, cho phép

người truy cập cùng một lúc có thể xem nhiều trang mà

không cần cuốn màn hình, mỗi khung chứa một trang

web riêng.

 Nếu trong trang đã sử dụng Frame thì không sử tag

Body

 Ví dụ: cần tạo một trang web mà khung bên trái chứa

các mục liên kết, bên phải hiển thị nội dung của các

trang liên kết, phần trên của trang chứa logo

pdf17 trang | Chuyên mục: HTML | Chia sẻ: dkS00TYs | Lượt xem: 3212 | Lượt tải: 3download
Tóm tắt nội dung Bài giảng Thiết kế Web tĩnh - Phần 1: Ngôn ngữ HTML - Chương 5: Frame, để xem tài liệu hoàn chỉnh bạn click vào nút "TẢI VỀ" ở trên
CHƯƠNG V 
FRAME 
I. GIỚI THIỆU FRAMES(KHUNG) 
  Khi cần hiển thị trên trình duyệt nhiều nội dung, chủ đề 
 khác nhau trên cùng một trang thì một giải pháp có thể 
 đáp ứng cho trường hợp này là frame (khung). 
  Có thể phân chia một trang thành các khung, cho phép 
 người truy cập cùng một lúc có thể xem nhiều trang mà 
 không cần cuốn màn hình, mỗi khung chứa một trang 
 web riêng. 
  Nếu trong trang đã sử dụng Frame thì không sử tag 
 Body 
  Ví dụ: cần tạo một trang web mà khung bên trái chứa 
 các mục liên kết, bên phải hiển thị nội dung của các 
 trang liên kết, phần trên của trang chứa logo 
Cách thực hiện: 
Trước hết ta tạo các trang web riêng: trang logo, trang 
chứa các liên kết và các trang nội dung chính, sau đó đưa 
các trang này vào các khung của frame 
II. CÁCH TẠO MỘT FRAME LAYOUT 
  Cú pháp: 
 Page Title 
 Frame Definitions 
1. Các dạng frame: 
  Tạo frame theo dòng 
 Cú pháp: 
 Nội dung tiêu đề 
 ….. 
– a, b: là độ cao của các dòng thứ 1, thứ 2 …, có thể tính 
 bằng pixel hoặc bằng % 
– Name: tên khung, (xác định chức năng của khung) 
– Content.htm: địa chỉ trang web xuất hiện đầu tiên trong 
 khung 
 Ví dụ: 
Frame 
 Tạo frame theo cột 
Cú pháp: 
Nội dung tiêu đề 
 ….. 
– a, b: là độ cao của các dòng thứ 1, thứ 2 …, có thể tính 
 bằng pixel hoặc bằng % 
– Name: tên khung, (xác định chức năng của khung) 
– Content.htm: địa chỉ trang web xuất hiện đầu tiên trong 
 khung 
Ví dụ: 
 Frame 
 III. CÁC THUỘC TÍNH CỦA FRAME 
 Noresize: Không đổi kích thước 
 Scrolling: có/không có thanh cuộn 
 Auto: Xuất hiện thanh cuộn khi nội dung dài 
 Yes: luôn xuất hiện thanh cuộn 
 No: không xuất hiện thanh cuộn 
 Ví dụ: 
 Frameborder: đường viền của khung mặc định là 1, muốn giữa 
 các khung không còn đường viền thì trong tag Frameset nhập 
 thêm Border=0, 
  Marginwidth: hiệu chỉnh khoảng cách từ nội dung 
 đến lề trái và phải của khung (tính bằng pixel) 
  Marginheight: hiệu chỉnh khoảng cách từ nội dung 
 đến lề trên và dưới của khung (tính bằng pixel) 
 Các frame lồng nhau: 
 … 
 … 
 IV. LIÊN KẾT FRAME 
 Trang đầu tiên của khung được chỉ ra trong thuộc tính 
 SRC, ta có thể chỉnh các trang khác cùng xuất hiện trong 
 khung đó bằng cách chỉ ra vị trí trang đích (Target) 
 Tại trang muốn tạo liên kết với khung, ta nhập cú pháp: 
 Nhãn mục liên kết 
 Trong đó : 
 Target=Name : tên của khung mà trang muốn liên 
 kết đến trong tag 
 Page.htm: trang hiển thị trong khung liên kết 
 Tag : 
 Nếu có nhiều liên kết đến các trang xuất hiện trong 
 cùng một khung thì thuộc tính target mặc định đặt 
 trong tag 
 Cú pháp: 
 V. PHẦN TỬ NOFRAMES 
 Phần tử NOFRAMES được sử dụng để chỉ nội dung thay thế cho 
 frame khi trình duyệt không hổ trợ frame. 
 Cú pháp: 
 Page title 
 Frame Definitions 
 Page Layout 
 VI. PHẦN TỬ IFRAME 
 Nếu muốn trộn văn bản và khung trong cùng một trang thì phải tạo 
 một khung bên trong trang bằng tag , khi trình duỵêt 
 không hổ trợ thì nội dung trong IFRAME sẽ bị trả lại 
 Cú pháp:Tại vị trí muốn chèn frame, nhập cú pháp: 
 <Iframe Src=”Page.htm” Name=”name” Width= x Height=y 
 Align=left/ right> 
 Nội dung thay thế khi trình duyệt không chấp nhận khung 
 Trong đó: 
 Page.htm: là trang đầu tiên xuất hiện trong khung 
 Name: tên của khung 
 x, y: kích thước của khung 
 Align: canh lề 
VÍ DỤ: 

File đính kèm:

  • pdfChuong 05 - Frame.pdf
Tài liệu liên quan