Trang chủ
/ học html
/ html
/ html can ban
/ html căn bản
/ lap trinh html
/ tạo khung html
/ tạo khung trang web
/TẠO KHUNG CHO TRÌNH DUYỆT
BÀI HỌC Bạn có thể tạo khung hay còn gọi là nhiều cửa sổ trong tình duyệt, mỗi cửa sổ là một tập tin HTML nào đấy. Đây là cách thiệt kế bạn thường hay gặp trước đây. Nhưng hiện nay người ta đang có phong trào hạn chế bớt việc tạo khung này. Ty nhiên việc tạo khung mang lại nhiều mặt có lợi như đơn giản hóa việc trình bày trang Web chẳng hạn. Bạn có thể tạo 2 khung: 1 khung là tóm tắt mục lục (như trong quyển sách chẳng hạn) còn khung kia dùng để hiển tthị những gì bạn chọn trong khung trước. Như vậy sẽ tiện hơn khi thiết kế chọn tiêu đề rồi mở trang sách để đọc, sau đó lại phải nhấn nút Back để quay lại trang mục lục. Trong trang tạo khung, bạn không được trình bày gì khác ngoài cặp thẻ để tạo khung. Bởi vì nội dung mỗi khung đã được liên kết đến 1 file HTML nào đó rồi. Để tạo khung ta dùng tag <FRAMESET> và </FRAMESET>. <FRAMESET COLS=x ROWS=x></FRAMESET> Trong đó x là các giá trị pixel hoặc phần trăm xác định kích thước các cạnh của khung. Chẳng hạn tạo 1 file mới có nội dung như sau: <HTML> <HEAD> <TITLE>HTMLStudy</TITLE> </HEAD> <FRAMESET COLS="30,50,*"></FRAMESET> </HTML> Điều này có nghĩa là tạo 3 khung theo chiều đứng, khung đầu rộng 30 pixel, khung giữa rộng 50 pixel và khung thứ ba là phần còn lại của cửa sổ. Hoặc 1 file khác <HTML> <HEAD> <TITLE>HTMLStudy</TITLE> </HEAD> <FRAMESET ROWS="40%,*"></FRAMESET> </HTML> Điều này có nghĩa là tạo 2 khung theo chiều ngang, khung đầu cao 20% chiều rộng cửa sổ và khung thứ 2 là phần chiều cao còn lại của cửa sổ. Bạn có thể lồng các cặp thẻ này vào nhau để tạo khung theo chiều ngang và dọc bất kỳ. Sau khi tạo khung xong, bạn phải định dạng từng khung vừa tạo bằng thẻ sau: <FRAME NAME=framename SRC=URL> Trong đó framename là tên bạn đặt cho khung để tiện việc chỉ định trong các liên kết sau này. Còn URL là địa chỉ tập tin HTML mà bạn muốn hiển thị trong khung. Thuộc tính Ngoài ra bạn còn có thể dùng các thuộc tính sau để định dạng cho thẻ <FRAMESET>:
Đối với thẻ <FRAME> bạn có thể dùng các thuộc tính sau:
Thẻ NOFRAMES Thẻ <NOFRAMES> dùng để thông báo dòng văn bản bên trong nó, trong trường hợp trình duyệt không cho phép hiển thị Frame. Nếu bạn thấy dòng này khi chạy chương trình thì bạn hiểu rằng, trình duyệt của bạn không hiển thị được trang Web này bởi vì nó được thiết kế dạng Frame. Muốn sử dụng được bạn phải nâng cấp trình duyệt của bạn lên version cao hơn. <NOFRAMES>Trình duyệt của bạn không hỗ trợ Frame</NOFRAMES> Dòng text "Trình duyệt của bạn không hỗ trợ Frame" này chỉ hiển thị khi trình duyệt không hỗ trợ Frame, nếu trình duyệt của bạn hỗ trợ điều này, bạn không thể thấy nó xuất hiện. THỰC HÀNH Bạn làm một website dạng sách điện tử, đầu tiên hãy tạo môt trang Web để tạo khung đặt tên là sach.html. File sach.html: <HTML> <HEAD><TITLE>Gioi thieu sach</TITLE></HEAD> <FRAMESET ROWS="30,*"> <FRAME NAME="tieude" SRC="tieude.html" NORESIZE> <FRAMESET COLS="100,*"> <FRAME NAME="mucluc" SRC="mucluc.html" NORESIZE> <FRAME NAME="noidung" NORESIZE> </FRAMESET> </FRAMESET> <NOFRAMES>Trình duyệt của bạn không hỗ trợ Frame</NOFRAMES> </HTML> Bạn tạo một trang Web dùng làm tiêu đề đặt tên là tieude.html và tạo một trang Web có các danh mục như mục lục của cuốn sách đặt tên là mucluc.html và tạo thêm các trang Web khác chứa nội dung của mỗi đề mục có trong mục lục và đặt tên chúng là trang1.html, trang2.html, trang3.html... File tieude.html: <HTML> <HEAD><TITLE>Gioi thieu sach</TITLE></HEAD> <BODY BGCOLOR=#FFFFFF> <H3>GIỚI THIỆU SÁCH</H3> </BODY> </HTML> File mucluc.html: <HTML> <HEAD><TITLE>Gioi thieu sach</TITLE></HEAD> <BODY BGCOLOR=#FFFFFF> <P><A HREF="trang1.html" TARGET="noidung"> Chương 1 </A> <P><A HREF="trang2.html" TARGET="noidung"> Chương 2 </A> <P><A HREF="trang3.html" TARGET="noidung"> Chương 3 </A> </BODY> </HTML> Các file trang1.html, trang2.html, trang3.html...: <HTML> <HEAD><TITLE>Gioi thieu sach</TITLE></HEAD> <BODY BGCOLOR=#FFFFFF> <P>Đây là chương 1 </BODY></HTML> Tương tự bạn gõ nội dung vào các trang khác. Cuối cùng, sau khi soạn xong, bạn chạy file sach.html bạn sẽ thấy như hình bên dưới. Khi click vào các liên kết trong trang mucluc bạn sẽ thấy các trang tương ứng hiện lên trong khung noidung. Để làm được việc này, bạn nên chú ý thuộc tính TARGET= trong mỗi liên kết trong thẻ <A> của tập tin mucluc.html. Đó chính là tên khung cửa sổ bạn muốn hiển thị kết quả, tên này chính là tên bạn đã định nghĩa trong thẻ <FRAME> của tập tin sach.html. Thẻ <NOFRAMES> dùng để thông báo dòng văn bản bên trong nó, trong trường hợp trình duyệt không cho phép hiển thị Frame. Nếu bạn thấy dòng này khi chạy chương trình thì bạn hiểu rằng, trình duyệt của bạn không hiển thị được trang Web này bởi vì nó được thiết kế dạng Frame. Muốn sử dụng được bạn phải nâng cấp trình duyệt của bạn lên version cao hơn.
|
Không có nhận xét nào:
Đăng nhận xét