Thông tin tài liệu
http://vietjack.com/html/index.jsp Copyright © vietjack.com Frame HTML Frame (hay Frame) HTML sử dụng để phân chia cửa sổ trình duyệt bạn thành khu vực khác mà khu vực tải tài liệu HTML riêng Một tập hợp Frame cửa sổ trình duyệt biết đến Frameset Cửa sổ chia vào Frame theo cách tương tự bảng: bên hàng cột Hạn chế Frame HTML Có số hạn chế sử dụng Frame, khơng đề nghị sử dụng trang web bạn: • Thường vài thiết bị nhỏ khơng giải Frame hình khơng đủ lớn để chia thành Frame • Đơi trang web bạn hiển thị khác máy tính khác độ phân giải hình • Nút quay trở lại trang trước khơng làm việc người dùng mong muốn • Vẫn có vài trình duyệt khơng hỗ trợ cơng nghệ Frame Tạo Frame HTML Để sử dụng Frame trang web, sử dụng thẻ thay cho thẻ Thẻ xác định cách chia cửa sổ thành Frame Thuộc tính rows thẻ xác định chiều ngang Frame thuộc tính cols xác định chiều dọc Frame Mỗi Frame dẫn thẻ xác định tài liệu mở Frame Ví dụ Ví dụ tạo Frame ngang: Ví dụ tao Frame HTML Trình duyet cua ban khong ho tro Frame Nó tạo kết sau: http://vietjack.com/ Trang chia sẻ các bài học online miễn phí Page 1 http://vietjack.com/html/index.jsp Copyright © vietjack.com Ví dụ Bạn theo dõi ví dụ trên, thay đổi thuộc tính rows thuộc tính cols thay đổi độ rộng chúng Nó tạo Frame dọc Vi du Frame HTML Trinh duyet cua ban khong ho tro Frame Kết là: Các thuộc tính thẻ Dưới thuộc tính quan trọng thẻ : http://vietjack.com/ Trang chia sẻ các bài học online miễn phí Page 1 http://vietjack.com/html/index.jsp Copyright © vietjack.com Thuộc tính Miêu tả cols Xác định số cột chứa frameset kích cỡ cột Bạn xác định độ rộng cột theo cách sau: • Theo giá trị tuyệt đối Pixels Ví dụ để tạo cột dọc, sử dụng cols="100, 500,100" • Phần trăm cửa sổ trình duyệt Ví dụ để tạo thiết lập Frame dọc: cols="10%, 80%,10%" • Sử dụng biểu tượng gán giá trị (wildcard) Ví dụ để tạo Frame dọc, bạn sử dụng cols="10%, *,10%" Trong trường hợp wildcard chiếm phần lại • Độ rộng quan hệ cửa sổ trình duyệt Ví dụ để tạo Frame dọc, sử dụng cols="3*,2*,1*" Đây cách thay cho việc sử dụng phần trăm Ở trường hợp này, cửa sổ windows chia thành phần, cột đầu chiếm nửa hình, cột thứ hai chiếm 1/3 cột thứ ba chiếm 1/6 rows Thuộc tính giống thuộc tính cols sử dụng giá trị tương tự, sử dụng để xác định hàng frameset Ví dụ để tạo Frame ngang, bạn sử dụngrows="10%, 90%" Bạn xác định chiều cao hàng theo cách tương tự cột border Thuộc tính xác định độ rộng Border (đường viền) Frame theo Pixel Ví dụ border="5" Một giá trị khơng có nghĩa khơng có Border frameborder Thuộc tính xác định có hay khơng Border hiển thị Frame Nó nhận giá trị Ví dụ frameborder=”0” xác định khơng có Border framespacing Xác định số lượng khoảng cách Frame frameset Nó nhận giá trị ngun Ví dụ framespcing=”10” nghĩa có 10 pixel khoảng cách Frame http://vietjack.com/ Trang chia sẻ các bài học online miễn phí Page 1 http://vietjack.com/html/index.jsp Copyright © vietjack.com Các thuộc tính thẻ Dưới thuộc tính thẻ : Thuộc tính Miêu tả src Thuộc tính sử dụng để đặt tên file tải Frame Giá trị địa URL Ví dụ, src=” /html/top_frame.jsp” tải file HTML có danh mục HTML name Thuộc tính cho phép bạn đặt tên cho Frame Nó sử dụng để rõ Frame tài liệu tải Nó đặc biệt quan trọng bạn muốn tạo link Frame mà tải trang web Frame khác, trường hợp đó, Frame thứ hai cần tên để xác định đích tới link frameborder Thuộc tính xác định có hay khơng Border Frame chỉ; thuộc tính quyền ưu tiên trước giá trị gán thuộc tính frameborder thẻ Và nhận giá trị (Yes) (No) marginwidth Thuộc tính cho phép bạn xác định độ rộng khoảng cách bên trái phải Border Frame với nội dung Frame Giá trị pixel Ví dụ marginwidth=”10” marginheight Thuộc tính cho phép bạn xác định chiều cao khoảng cách Border Frame nội dung Giá trị pixel Ví dụ marginheight=”10” noresize Theo mặc định bạn đặt lại kích thước cho Frame cách nhấn chuột vào Border Frame kéo Thuộc tính noresize ngăn cản người sử dụng đặt lại kích cỡ Ví dụ noresize=”noresize” scrolling Thuộc tính điều khiển xuất xuất Frame Nó nhận giá trị “yes”, “no”, “auto” Ví dụ scrolling=”no” nghĩa khơng có (scrollbar) http://vietjack.com/ Trang chia sẻ các bài học online miễn phí Page 1 http://vietjack.com/html/index.jsp Copyright © vietjack.com longdesc Thuộc tính cho phép bạn cung cấp đường link tới trang web khác chứa miêu tả dài nội dung Frame Ví dụ longdesc=”framedescription.jsp” Trình duyệt hỗ trợ cho Frame Nếu người dùng sử dụng trình duyệt cũ trình duyệt mà khơng hỗ trợ Frame phần tử hiển thị tới người dùng Vì bạn phải đặt phần tử bên phần tử phần tử hỗ trợ để đổi vị trí phần tử , trình duyệt khơng hiểu phần tử hiểu bên phần tử mà có chứa phần tử Bạn đặt vài thơng báo lịch thiệp tới người dùng bạn mà sử dụng trình duyệt cũ Ví dụ Sorry!! Trinh duyet cua ban khong ho tro Frame ví dụ Các thuộc tính name target Frame Một cách phổ biến sử dụng Frame để đặt ví trí điều hướng Frame sau tải trang Frame riêng biệt Ví dụ đoạn code: Vi du Target Frame HTML Trinh duyet cua ban khong ho tro Frame Tại bạn tạo cột để chứa Frame Frame rộng 200 pixel chứa menu điều hướng thực file menu.htm Cột hai phần trống lại chứa phần trang thực tệp main.htm Đối với ba link có menu, đề cập đến Frame mục tiêu main_page, bạn nhấn chuột vào link menu link có sẵn mở main_page Dưới nội dung menu.htm: Google Microsoft BBC News http://vietjack.com/ Trang chia sẻ các bài học online miễn phí Page 1 http://vietjack.com/html/index.jsp Copyright © vietjack.com Và nội dung main.htm: This is main page and content from any link will be displayed here. So now click any link and see the result.
Khi tải tệp test.htm, hiển thị kết quả: Bây bạn thử nhấn chuột vào link có bên trái xem kết Thuộc tính target nhận giá trị sau: Tùy chọn Miêu tả _self Tải trang web Frame _blank Tải trang cửa sổ trình duyệt _parent Tải trang cửa sổ chính, trường hợp frameset đơn cửa sổ trình duyệt _top Tải trang cửa sổ trình duyệt, thay cho trang targetframe Tải trang Frame mục tiêu đặt tên http://vietjack.com/ Trang chia sẻ các bài học online miễn phí Page 1 ... tạo Frame dọc Vi du Frame HTML< /title> Trinh duyet cua ban khong ho tro Frame < /html> Kết là: Các... Vi du Target Frame HTML< /title> Trinh
Ngày đăng: 02/12/2017, 18:21
Xem thêm:
