Thiết kế web với Microsoft Frontpage P7

THIẾT KẾ WEB VỚI MICROSOFT FRONTPAGE 2000 Tiếp tục, bạn nhấp vào dấu x một lần nữa để đóng trang homepage bottom.htm lại. Khi thực hiện xong việc đóng hai trang gioi thieu.htm và homepage bottom.htm, bạn được đưa trở lại trang tổng hợp với hai trang Frame. Tiếp theo, bạn sẽ tạo một liên kết để khi nhấp vào nút Giới thiệu trang gioi thieu.htm (vừa được tạo) sẽ được hiển thị trong trang Frame bên dưới bằng cách thực hiện tuần tự các thao tác sau: Trước tiên, bạn nhấp chọn nút Giới thiệu. Khi nhấp chọn, bạn sẽ thấy xuất hiện một khung bao quanh nút này như hình minh họa. Tiếp theo, bạn nhấp chọn Insert > Hyperlink… trên thanh trình đơn hoặc nhấn tổ hợp phím Ctrl + K. Hoặc có thể nhấp vào biểu tượng Hyperlink trên thanh công cụ chuẩn. Hộp thoại Edit Hyperlink xuất hiện. Trong hộp thoại này, theo thói quen bạn sẽ nhấp vào mục Look in để chỉ đường dẫn đến trang Web có tên gioi thieu.htm. Tuy nhiên, trong trường hợp này, bạn sẽ không thực hiện được (Look in rỗng). Tuy nhiên, bạn không phải lo lắng về vấn đề này. Bạn hãy nhấp vào biểu tượng Make a hyperlink to a file on your computer. Hộp thoại Select File xuất hiện và nằm chồng lên hộp thoại Edit Hyperlink. Trên hộp thoại Seclect File, trong mục Look in, bạn chỉ đường dẫn đến thư mục chứa trang Web có tên gioi thieu.htm. (Trong bài tập này, trang gioi thieu.htm được lưu trong thư mục là 1 CD LOGO) Khi chọn đúng đường dẫn, danh sách các trang Web đã lưu trữ xuất hiện trong khung bên dưới. Bạn nhấp chọn file gioi thieu. (Tên file này sẽ xuất hiện trong mục File name). Khi chọn xong, bạn nhấp nút OK. Sau khi chọn OK, cả hai hộp thoại Select File và Edit Hyperlink ngay lập tức đóng lại. Tiếp tục, bạn hãy nhấn Ctrl + S để lưu lại những thao tác đã thực hiện. Để hiển thị kết quả thực hiện lên màn hình trình duyệt, bạn nhấp chọn biểu tượng Preview in Browser trên thanh công cụ chuẩn. Hoặc bằng cách nhấp chọn File > Preview in Browser… từ thanh trình đơn. Hộp thoại Preview in Browser xuất hiện. Bạn chấp nhận các thông số mặc định sau đó nhấp chọn Preview. (Hộp thoại này chỉ xuất hiện khi bạn chọn File > Preview in Browser…) Sau khi nhấp chọn nút Preview, cửa sổ Microsoft Internet Explorer xuất hiện. Nội dung trang Web hiển thị trên màn hình trình duyệt. Bạn hãy nhấp chuột vào nút Giới thiệu (Lúc này con trỏ chuột có hình bàn tay, vòng tròn trước chữ Giới thiệu đổi màu). Và điều quan trọng là trang gioi thieu.htm đã hiển thị trong trang Frame dưới với tiêu đề GIỚI THIỆU (như đã được thiết kế trước đó) Ngoài ra, bạn cũng có thể kiểm tra thao tác thực hiện bằng cách nhấp vào tab Preview trên cửa sổ FrontPage (không phải mở màn hình trình duyệt) Sau khi nhấp chọn Preview (chữ Preview được in đậm lên hơn so với các chữ trên các tab bên cạnh), bạn nhấp nút Giới thiệu và bạn cũng nhận được kết quả hiển thị giống như khi chạy trên màn hình trình duyệt. Tuy nhiên, bạn có thể thấy trong hai cách hiển thị trên đều không đẹp mắt lắm vì có một thanh ngang phân cách giữa hai trang Frame trên và dưới. Để che không cho hiển thị thanh phân cách này, bạn hãy thực hiện thêm một số thao tác đơn giản sau: Đầu tiên, bạn hãy nhấp chọn vào tab Normal trên cửa sổ FrontPage. Lưu ý: Cửa sổ Preview chỉ dùng để hiển thị kết quả. Nếu bạn muốn có bất kỳ sự thay đổi hay chỉnh sửa nào lên trên Web thì bắt buộc phải trở lại cửa sổ Normal. Sau khi nhấp chọn tab Normal để trở về cửa sổ thiết kế, bạn hãy đưa chuột vào đường phân cách giữa hai trang Frame cho đến khi thấy con trỏ chuột có hình mũi tên ở hai đầu. Bạn nhấp chuột phải. Một menu xuất hiện với duy nhất một chọn lựa là Frame Properties…. Bạn hãy nhấp chọn nó. Hộp thoại Frame Properties xuất hiện. Trong hộp thoại này, bạn nhấp vào nút Frame Page…. Hộp thoại Page Properties xuất hiện với tab mặc định là tab Frames. Nếu tab này chưa được chọn, bạn hãy nhấp chuột để chọn tab này. Trong tab này, bạn thấy hộp kiểm phía trước chữ Show Boders đã được chọn. Bây giờ bạn hãy nhấp vào hộp kiểm này để loại bỏ nó đi. Sau khi nhấp vào hộp kiểm Show Boders, số trong ô màu trắng của mục Frame Spacing được trả về giá trị 0. Bạn hãy giữ nguyên mặc định này và nhấp chọn nút OK. Sau khi nhấp chọn OK, bạn được đưa trở lại hộp thoại Frame Properties. Bạn giữ nguyên các thông số mặc định và nhấp chọn nút OK. Lúc này, trên cửa sổ FrontPage, đường phân cách giữa hai trang Frame đã bị ẩn đi. Bạn nhấn Ctrl + S để lưu lại sau đó cho trang Web này hiển thị lên trình duyệt. Nhấp chọn nút Giới thiệu. Lúc này, trang Web của bạn trông đẹp mắt hơn với sự “biến mất” của đường phân cách giữa hai trang Frame. Cuối cùng, để hoàn chỉnh cấu trúc các trang Web này, bạn hãy tiến hành tạo các trang cai dat.htm, ly thuyet.htm, bai tap.htm, xem phim.htm, thamkhao.htm và thoat.htm. Sau đó, lần lượt nhấp vào các nút Cài đặt, Lý thuyết, Bài tập, Xem phim, Tham khảo và Thoát để tạo liên kết đến từng trang theo các bước hướng dẫn đã trình bày trước đó. Chúc bạn thành công!   . THIẾT KẾ WEB VỚI MICROSOFT FRONTPAGE 2000 Tiếp tục, bạn nhấp vào dấu x một lần nữa để đóng. trang gioi thieu.htm đã hiển thị trong trang Frame dưới với tiêu đề GIỚI THIỆU (như đã được thiết kế trước đó) Ngoài ra, bạn cũng có thể kiểm tra thao tác