Bài giảng Ngôn ngữ đánh dấu siêu văn bản HTML – Hyper Text Makeup Language

ác dòng văn bản là đối tượng chủ cho mối nối liên kết. Trong đó LINK là liên kết chưa xem VLINK là liên kết đã xem ALINK là liên kết đang xem Cú pháp Nội dung của tập tin html được chèn tại đây Lưu ý: Mặc định là LINK=blue (#0000FF), VLINK=purple (#800080) và ALINK=red (#FF0000). Cách thức xác lập màu giống BGCOLOR và TEXT LEFTMARGIN: Thuộc tính này dùng để canh lề trái. Cú pháp Nội dung của tập tin html được chèn tại đây Lưu ý: X là một số nguyên, được tính bằng số lượng pixel từ bên trái sang Mã nguồn Test Chao mung cac ban den voi lop hoc Thuong mai dien tu va Ung dung Internet Hiển thị trên trình duyệt Web TOPMARGIN: Thuộc tính này dùng để canh lề bên trên Cú pháp Nội dung của tập tin html được chèn tại đây Lưu ý: X là một số nguyên, được tính bằng số lượng pixel từ trên xuống dưới Mã nguồn Test Chao mung cac ban den voi lop hoc Thuong mai dien tu va Ung dung Internet Hiển thị trên trình duyệt Web Các thẻ định nghĩa đoạn văn bản, kiểu chữ Thẻ tag P: Định nghĩa đoạn văn bản. Cú pháp: nội dung đoạn văn bản Các thuộc tính của thẻ P ... : Tất cả nội dùng nằm giữa tag này sẽ được canh về bên phía trái lề trang web. Đây cũng là thẻ mặc định. ... : Tất cả nội dung nằm giữa hai tag này sẽ được canh giữa ... : Tất cả nội dung nằm giữa hai tag này sẽ được canh phải Mã nguồn Test Day la noi dung doan text Hiển thị trên trình duyệt Web Thẻ tag BR: Dùng để xuống dòng. Cú pháp: Mã nguồn Test Day la noi dung doan text thu 1 Day la noi dung doan text thu 2 Day la noi dung doan text thu 3 Hiển thị trên trình duyệt Web Thẻ tag H: Quy định kích cỡ của tiêu đề. Cú pháp: Tiêu đề Trong đó: x =1,2,3,4,5,6. x càng nhỏ cỡ chữ càng lớn. Mã nguồn Test Tieu de co chu lon nhat (H1) Tieu de co chu lon thu hai (H2) Tieu de co chu lon thu ba (H3) Tieu de co chu lon thu tu (H4) Tieu de co chu lon thu nam (H5) Tieu de co chu nho nhat Hiển thị trên trình duyệt Web Thẻ tag B: Hiển thị chữ in đậm. Cú pháp: Phần chữ đậm Mã nguồn Test Phan text chu khong to dam Phan text chu to dam Hiển thị trên trình duyệt Web Thẻ tag I: Hiển thị chữ in nghiêng. Cú pháp: Phần chữ nghiêng Mã nguồn Test Phan text chu khong in nghieng Phan text chu in nghieng Hiển thị trên trình duyệt Web Thẻ tag U: Hiển thị chữ gạch chân. Cú pháp: Phần chữ gạch chân Mã nguồn Test Phan text chu khong gach chan Phan text chu gach chan Hiển thị trên trình duyệt Web Thẻ tag FONT: Quy định font chữ. Cú pháp: Một số tên font thông dụng: .VnTime; .VnTimeH; .VnArial; .VnArialH;.VnAvant; Mã nguồn Test Phần text có font Arial theo chuẩn Unicode, cỡ chữ bằng 2, màu đen Hiển thị trên trình duyệt Web Thẻ tag Sub: Hiển thị chữ nhỏ chỉ số dưới. Cú pháp: Phần chữ nhỏ chỉ số dưới Mã nguồn Test Đối tượngChi so duoi Hiển thị trên trình duyệt Web Mã nguồn Test Phan test font chu Arial theo chuan Unicode, co chu bang 3, mau doChi so duoi Hiển thị trên trình duyệt Web Thẻ tag Sup: Hiển thị chữ nhỏ chỉ số trên. Cú pháp: Phần chữ nhỏ chỉ số trên Mã nguồn Test Đối tượngChi so duoi Hiển thị trên trình duyệt Web Mã nguồn Test Phan test font chu Arial theo chuan Unicode, co chu bang 3, mau xanhChi so tren Hiển thị trên trình duyệt Web Thẻ tag DL: Dùng để định nghĩa một danh sách. Cú Pháp Đề mục danh sách Danh sách mức 1 Danh sách mức 1 Danh sách mức 2 Danh sách mức 2 Danh sách mức 1 Danh sách mức 2 ..... Mã nguồn Test De muc danh sach Danh sach muc 1 Danh sach muc 1 Danh sach muc 2 Danh sach muc 2 Danh sach muc 1 Danh sach muc 2 …... Hiển thị trên trình duyệt Web Thẻ tag UL: Tạo danh sách có bullets Cú pháp: Text1 Text3 Text3 …. Mã nguồn Test Text1 Text2 Test3 Hiển thị trên trình duyệt Web Thẻ tag OL: Tạo danh sách có đánh số theo thứ tự. Cú pháp: Text1 Text2 Text3 ...... Mã nguồn Test Text1 Text2 Test3 Hiển thị trên trình duyệt Web Thẻ tag HR: Tạo đường gạch ngang để phân cách các đoạn trong trang Web . Cú pháp: Các thuộc tính của thẻ HR: : Chỉ định kích thước : Chỉ định độ rộng : Canh lề trái, phải và giữa : Chỉ định màu giống BGCOLOR Ví dụ: tạo đường gạch ngang có độ rộng bằng 10 và có màu xanh Mã nguồn Test Khoa Kinh te Thuong mai Hom nay khai giang lop hoc Thuong mai dien tu va Ung dung Internet Hiển thị trên trình duyệt Web Thẻ tag CENTER: Đoạn văn bản nằm giữa tag này sẽ được định dạng canh giữa so với lề trái và lề phải Cú pháp: Nội dung đoạn văn bản được đặt tại đây Mã nguồn Test Khoa Kinh te Thuong mai Hom nay khai giang lop hoc Thuong mai dien tu va Ung dung Internet Hiển thị trên trình duyệt Web Thẻ tag MARQUEE: Thẻ này dùng tạo hiệu ứng chạy chữ trong tập tin html. Dòng văn bản nằm giữa hai thẻ này sẽ chạy theo một kiểu đã quy định trước, khi trình duyệt Web hiển thị trang Web nằm giữa hai tag này sẽ được định dạng canh giữa so với lề trái và lề phải Thẻ này chỉ được hỗ trợ riêng cho trình duyệt Internet Explorer, các trình duyệt Web khác không hỗ trợ thẻ này Cú pháp: Nội dung dòng chữ chạy nằm ở đây Các thuộc tính của thẻ MARQUEE: ALIGN="left/right/top/middle/bottom": Canh dòng văn bản so với khung chứa văn bản đó. BEHAVIOR="scroll/slide/alternate": Chỉ định kiểu chữ chạy. SCROLL: Dòng chữ chạy theo một hướng nhất định và lập đi lập lại quá trình đó. Đây là thuộc tính mặc nhiên SLIDE: Dòng chữ chạy chớp tắt. ALTERNATE: Dòng chữ chạy đổi hướng khi đụng đường biên của khung bao văn bản. BGCOLOR="#rrggbb/color name": Chỉ định màu nền cho khung chứa dòng chữ chạy. DIRECTION="left/right": Chỉ định hướng chạy của dòng văn bản. Mặc định là từ phải qua trái. LOOP="number/-1/infinite": LOOP=n: Chỉ định số vòng lập lại. Nếu n=-1, hay LOOP=INFINITE là lập lại liên tục. Thuộc tính LOOP không được dùng chung với thuộc tính BEHAVIOR Mã nguồn Test Khoa Kinh te Thuong mai Hom nay khai giang lop hoc Thuong mai dien tu va Ung dung Internet Hiển thị trên trình duyệt Web Các thẻ định nghĩa hình ảnh, âm thanh Thẻ tag IMG: Thẻ này dùng để chèn một hình ảnh vào tập tin html Cú pháp: Các thuộc tính của thẻ IMG ALIGN="left/right/top/texttop/middle/absmiddle/baseline/bottom/absbottom": Thuộc tính này dùng để so hàng hình ảnh với các dòng văn bản trong web. ALT="Alternative Text": Thuộc tính này cho hiển thị một dòng văn bản thay thế cho tập tin hình ảnh trong trường hợp trình duyệt Web đang ở trong chế độ không hiển thị được hình ảnh. Dòng văn bản này cũng hiển thị theo dạng ToolTip khi dời Mouse đến hình. SRC="URL of image": Chỉ định địa chỉ tập tin hình chèn vào trang Web. WIDTH=”value”/ HEIGHT=”value”: Chỉ định khoảng cách dành sẳn cho hình trong khi trình duyệt Web nạp toàn bộ hình. BORDER=”value”: Chỉ định cho hiển thị đường viền bao quanh hình ảnh. Giá trị value là số nguyên dương. VSPACE=”value” HSPACE=”value”: Quy định khoảng trống giữa hình và đoạn văn bản. VSPACE cho trên và dưới hình, HSPACE cho trái và phải hình. Giá trị value được tính theo đơn vị pixel. Mã nguồn Test Meo va chuot Hiển thị trên trình duyệt Web Thẻ tag BGSOUND: Thẻ này dùng để liên kết trang Web với một tập tin hình ảnh, khi trình duyệt Web hiển thị trang Web thì cũng đồng thời phát ra tập tin âm thanh. Tập tin âm thanh phải thuộc một trong các dạng *.wav, *.au hoặc *.midi Cú pháp: Các thuộc tính của thẻ BGSOUND SRC: Chỉ định điạ chỉ file âm thanh. LOOP=n: Chỉ định số dòng lập lại. Nếu n=-1 hay LOOP=INFINITE là cho lập liên tục. Mã nguồn Test Cheri Cheri Lady CHƯƠNG 4: GIỚI THIỆU FRONT PAGE 2002 Có rất nhiều chương trình để tạo một trang Web như Frontpage, Hotdog, Dream weaver...Trong chương này sẽ giới thiệu với các bạn sử dụng và làm quen với chương trình Frontpage 2002, trong chương này chúng ta sẽ học: Mở FrontPage. Tạo trang Web. Làm việc với văn bản và liên kết Chèn hình ảnh và tập tin. Định dạng danh sách Định vị các đối tượng. Thiết kế bộ sưu tập ảnh. Tạo cấu trúc Web site. Lưu. Mở FrontPage Trên thanh tác vụ Windows, bấm nút Start , chọn Programs, và chọn Microsoft FrontPage. Khi mở Frontpage 2002, giống như bất cứ một chương trình soạn thảo nào, chúng ta sẽ thấy một loạt các công cụ phía trên. Các công cụ này có thể cho hiển thị hoặc không bằng cách click chuột phải lên thanh công cụ rồi chọn loại công cụ cần hiển thị. Nếu đây là lần đầu tiên bạn mở FrontPage, một trang trắng được tạo ra sẵn. Lưu ý Nếu FrontPage được sử dụng để hiệu chỉnh một Web site nào đó, nó sẽ tự động mở Web site đó mỗi lần khởi động. Đề đóng Web site: vào menu File, chọn Close Web. Cửa sổ Frontpage Đây là hình ảnh của một trang Web được mở bằng Frontpage Các thành phần Mô tả Page Tab Dùng để chọn trang làm việc. Title Bar Hiển thị tên của trang Web và vị trí của trang Trang Website Menu Bar Chứa các thực đơn lệnh Ask a Question Box Hổ trợ người sử dụng khi cần hướng dẫn thực hiện các thao tác Close Page Đóng trang thực hiện Scroll Bars Dùng để di chuyển trên trang hiện hành Status Bar Thanh trạng thái, thường dung để quan sát đích của các liên kết Page View Panes Các khung hiển thị trang: Gồm 3 chế độ normal, html và preview. Progress Indicator Chỉ thị của tiến trình Estimated Download Time Thời gian tải trang ước lượng Task Pane Khung tác vụ Thanh công cụ Standard và Formating Các thanh công cụ thường sử dụng Views Bar Thanh chuyển đổi chế độ views Tạo trang Web – Tạo trang chủ Trang chủ là cánh cuả để đi vào web site cuả bạn. Nó chứa thông tin về nội dung và các vấn đề người đọc có thể quan tâm. Trên trang chủ thường có chứa các liên kết đến các trang khác. Cách thức tạo mới một trang chủ như sau: Mở Frontpage Trên trang trắng trong chế độ View Page, nhập Chào mừng các bạn đến với Microsoft Front Page 2002! Và nhấn ENTER. Giống như trong Word nhấn enter có nghĩa là xuống hàng. Kế tiếp nhập đoạn sau Đây là chương trình dùng để thiết kế trang Web cho những người không chuyên. Dùng Front Page chúng ta có thể tạo được một trang Web rất nhanh chóng, đơn giản và không tốn nhiều công sức. Nhấn ENTER. Giả sử nội dung cuả Web site đã được chuẩn bị sẵn, chúng ta có thể đưa các tài liệu đã có vào trong các trang Web mà không cần phải gõ lại Kế tiếp ta sẽ đưa một ảnh vào trong trang Web. Trong ví dụ này ta sẽ nhập vào hình sau: Chèn Hình ảnh và Tập tin Thực hiện chèn hình vào trang chủ. Vào menu Insert, chọn Picture, và bấm From File. FrontPage hiển thị ra hộp thoại Picture. Tại hộp Look In, Chọn ổ đĩa và thư mục chứa hình Chọn tên hình có tên cpu, bấm nút Insert. Nhấn ENTER đề xuống hàng. Nếu chúng ta chỉ chèn hình và chữ vào trang chủ thì người dùng không thề di chuyển đến các trang khác. Muốn tạo ra các đối tượng có thể bấm chuột vào được, ta phải gán các liên kết vào các đối tượng đó. Một liên kết là một địa chỉ cuả một trang khác ở trong phạm vi Website hoặc trên Internet. Tạo ra một liên kết có nghĩa là cho phép người dùng di chuyển đến một trang khác bằng cách bấm chuột vào đối tượng đó. Tạo liên kết từ hình ảnh. Trên trang chủ, bấm chọn hình mới thêm vào. Vào menu Insert, chọn Hyperlink (hoặc bấm Ctrl+K). FrontPage hiển thị hộp thoại Insert Hyperlink. Trong hộp thoại này ta sẽ đưa vào đích của liên kết. Trong hộp Address, nhập www.intel.com. Lưu ý Frontpage sẽ tự động thêm tiếp đầu ngữ http. HTTP là tên tắt cuả Hypertext Transfer Protocol. Đây chính là một giao thức Internet để cho các trình duyệt có thể truy xuất thông tin từ Web server. Trong ví dụ trên khi người dùng bấm vào hình họ sẽ được chuyển đến trang chủ của Intel. Chọn OK để kết thúc tạo liên kết. Chèn hình vào trang chủ Nhấn Ctrl+Home để trở về đấu trang. Trong menu Insert, Chọn Picture, và chọn From File. Nhấp đúp vào tên tập tin hình logo.gif. FrontPage sẽ chèn hình vào vị trí hiện hành. Nhấn ENTER để đưa dòng tiêu đề xuống hàng. Canh giữa văn bản và hình ảnh. Để canh giữa các thành phần trên một trang chúng ta thực hiện như sau: Vào menu Edit, chọn Select All. Vào menu Format, chọn Paragraph. Trong danh sách Alignment, chọn Center, sau đó nhấn OK. Bấm tạ bất kỳ vị trí nào trên trang để thôi chọn. Lưu trang hiện hành Vào menu File, chọn Save As. Trong hộp thoại Save As, chọn My Documents trong cây thư mục. Tại vị trí hộp Page Title, bấm nút Change Title. Trong hộp Set Page Title, gõ Home Page và bấm OK. Trong hộp File Name, gõ homepage, và bấm Save. Các tùy chọn cuả Page View Hiển thị các thẻ HTML trên trang hiện hành. Trong Page view , chọn Reveal Tags trong menu View FrontPage hiển thị cách biểu diễn các thẻ HTML. Điều này thật sự có ích nếu người sử dụng biết về mã HTML. Để che giấu các thẻ, bấm Reveal Tags trên menu View một lần nữa. Hiển thị mã nguồn HTML của trang hiện hành Trong Page View, bấm chọn nút HTML tại đáy trang. Chế độ này dành cho những người thiết kế trang Web đã quen với mã HTML và có thể chỉnh sửa code để thay đổi thiết kế. Chọn nút Normal tại đáy trang để trở về khung Normal. Lưu ý: Khi làm việc trong khung HTML, chúng ta vẫn có thể sử dụng các lệnh menu và thanh công cụ giống như trong khung Normal. Chế độ xem trước trang Web (Preview) Chọn Preview để có thể xem trước trang Web. Lưu ý: Trên máy tính cần có trình duyệt Web Microsoft Internet Explorer để có thể dùng chức năng này. Xem trước trang Web là một cách nhanh chóng để hình dung kết quả thiết kế sẽ hiển thị như thế nào trên trình duyệt Web. Bấm nút Normal tại đáy trang để trở về khung Normal một lần nữa. Tạo Web site với FrontPage Một Website là một tập hợp các trang Web, hình ảnh, tư liệu, multimedia, và các tập tin khác, Website được lưu trữ trên máy chủ Web Server hoặc trên ổ đĩa nội bộ cuả máy tính. Trong phần trên, chúng ta đã thấy tạo trang Web với FrontPage thật là dễ dàng, rất giống với cách taọ một văn bản trong Word. Điều khác biệt ở đây là các liên kết. Công việc thiết kế trang Web ngoài phần tạo nội dung hình ảnh thì phần duy trì các liên kết là không kém phần quan trọng Tạo một Website mới. Vào menu File, chọn Close để đóng các trang hiện hành. Vào menu File, chọn mục New, và chọn Page or Web. FrontPage sẽ hiển thị khung tác vụ New Page or Web. Chúng ta có thể chọn nhiều mẫu Web site đã được thiết kế sẵn. Ở dưới New From Template, chọn Web Site Templates. Chọn One Page Web, bấm OK và nhấn Tab. Khi nhấn phím Tab, con trỏ sẽ nhảy đến các hộp tên và vị trí cuả Website mới. Trong hộp Specify location của New Web, nhập tên :\My Documents\My Webs\Welcome Intel.htm, và bấm OK. Lưu ý là ổ đĩa logic, thường là ổ đĩa C:\ hoặc D:\. FrontPage tạo một Website mới có tên là “Welcome Intel,” và hiển thị tên đó ở trên thanh tiêu đề. Do chúng ta sẽ làm việc với nhiều tập tin trong Website, FrontPage cũng hiển thị Folder List, tương tự như Windows Explorer. Nếu Folder List không hiển thị chúng ta làm như sau: Trên thanh công cụ Standard, bấm vào mũi tên bên cạnh Toggle Pane sau đó chọn Folder List. Chọn biểu tượng Navigation trên thanh Views. Navigation View sẽ hiển thị cấu trúc dạng cây cuả Website. Khi chúng ta tạo ra một Website một trang thì đó chính là trang chủ, có biểu tượng Thanh công cụ Navigation có hình dạng như sau: Tạo cấu trúc Web Site Trong chế độ Navigation View, bấm New Page trên thanh công cụ Standard. FrontPage tạo ra một trang mới “New Page 1” ở dưới trang chủ. Chú ý đó chỉ là những con trỏ chỉ tới những trang web thực mà ta sẽ taọ ra sau này. Để nhanh chóng taọ ra các trang còn lại nhấn CTRL + N ba (3) lần. CTRL+N là phím tắt cuả lệnh tạo trang mới. Lưu ý: Trong Navigation view, các trang đang được chọn có màu xanh, các trang khác có màu vàng. Giả sử đang chọn trang chủ, nhấn Tab. Mỗi lần nhấn Tab, con trỏ sẽ nhảy tới trang kế tiếp trong cấu trúc cây. Ta có thể thay đổi tên của trang Web trong các hộp tên tương ứng. Nhập About Us, và nhấn Tab. About Us là tiêu đề trang để tự giới thiệu Website Welcome Intel. Lập lại các bước trên cho các trang khác, đổi tên New Page 2 thành Products, New Page 3 thành Photo Gallery, và New Page 4 thành Links. Nhấn ENTER sau khi đổi tên. Để hiệu chỉnh nội dung cuả một trang Web chúng ta có thể nhấp đúp chuột vào tên trang trong NavigationView. Bây giờ chúng ta sẽ thay thế trang chủ bằng trang đã được tạo ra trong phần trên. Nhập một trang Web vào Website Trong Navigation view, Nhấp đúp chuột vào index.htm để mở tập tin này ra. Vào menu Insert, chọn File. Trong hộp thoại Select File, di chuyển đến thư mục My Documents. Bấm chọn tập tin homepage, bấm Open. Bấm biểu tượng lưu trên thanh công cụ standard. FrontPage hiển thị hộp thoại Save Embedded Files. Ở đây chúng ta có thể xem trước, đổi tên, cấp nhật các tập tin được nhúng vào trang hiện hành. Trong hộp Save Embedded Files, chọn OK. Tạo nội dung Web site Hiệu chỉnh trang About Us. Chọn biểu tượng Navigation trong thanh Views để trở về chế độ Navigation View. Nhấp đúp chuột vào trang About Us đề mở trang đó trong Page View. Trang này sẽ phải chứa các nội dung để giới thiệu công ty hoặc tổ chức mà chúng ta bạn muốn giới thiệu đến với đọc giả cuả trang Web. Nếu nội dung đã được chuẩn bị sẵn, ta có thể sử dụng lệnh Insert File để đưa vào trong trang. Trên thanh công cụ standard, bấm Save để lưu các thay đổi của trang About Us. Đóng cây thư mục Folder List. Hiệu chỉnh trang Products. Trang này có mục đích giới thiệu với khách hàng các sản phẩm và dịch vụ cuả công ty. Đồng thời trên trang này chúng ta cũng tạo một phiếu phản hồi ý kiến - Feedback Form để thu thập ý kiến khách hàng. Trên thanh công cụ standard, bấm Toggle Pane , rồi chọn Folder List. Nhấp đúp Products.htm trong Folder List để mở trang trong chế độ Page View. Thôi hiển thị Folder List. Vào menu Insert, chọn File. Tương tự như trên ta có thể nhập vào một tập tin bất kỳ chứa sẵn nội dung cần đưa vào trong trang. Bấm nút Save. Trong trang Products này chúng ta cần thêm một số các thiết kế khác. Tạo danh sách đánh dấu. Với trang Products đang được mở tìm từ “CPU List.” Chọn danh sách, kết thúc với “Pentium Duo Core.” Trên thanh công cụ, chọn biểu tượng Bullets . Trang của chúng ta sẽ có dạng sau: Định vị hình ảnh. Trang Products còn đang hiển thị trong Page View, đặt con trỏ sau “cách sử dụng Bullet như sau.” Chọn biểu tượng Insert Picture From File trên thanh tác vụ Chọn tên tập tin p4_13micron.jpg, và sau đó bấm Insert. FrontPage sẽ chèn một tập tin hình ảnh của chipset CPU ngay sau chữ “cách sử dụng Bullet như sau.” Tiếp theo bấm vào hình và chọn nó. Trong menu Format, chọn Position. FrontPage hiển thị hộp thoại Position. Trong phần Wrapping style, chọn Right, và sau đó bấm OK. Bấm nút Save trên thanh tác vụ để lưu các thay đổi của trang Products. Trong hộp thoại Save Embedded Files, chọn bấm OK. Trang của chúng ta có dạng như sau Thêm các tập tin vào Web site Chọn biểu tượng Folders trên thanh tác vụ để chuyển về chế độ Folders View. Vào menu File, chọn Import. FrontPage hiển thị hộp thoại Import. Tại đây chúng ta có thể thêm tập tin, thư mục từ máy tính cục bộ hay từ mạng, từ máy chủ nội bộ hay từ Internet. Trên hộp thoại Import bấm chọn Add File. Trong hộp thoại Add File to Import List, chuyển tới thư mục tên Pictures Kế tiếp, bấm Files of type list, và sau đó bấm GIF and JPEG (*.gif, *.jpg) Bấm chọn chip.gif trong danh sách. Kế tiếp, giữ Ctrl, và bấm chọn các tập tin ảnh như amdchip.gif, cpu.gif, pentium4.gif, pentium3.gif. Trong hộp thoại Add File to Import List, thả phím Ctrl, và sau đó bấm Open. Bấm OK. Tạo trang triển lãm ảnh - Photo Gallery Bản chất của World Wide Web là một giao diện đồ họa, do đó việc sử dụng hình ảnh trên các trang Web là một công việc phổ biến và thịnh hành. Nhiều Website có nhu cầu đưa lên một số lượng lớn các ảnh được sắp xếp theo những chủ đề nhất định và theo những định dạng nhất quán, chúng ta gọi đó là những phòng triển lãm ảnh trên Internet. Hiệu chỉnh trang Photo Gallery Cho hiển thị Folder List. Bấm đúp chuột photo_gallery.htm. Thôi hiển thị Folder List. Khi trang trắng hiện ra, nhập CPU Lists Photos rối nhấn ENTER. Trên dòng kế tiếp, gõ: Hình ảnh về các loại CPU. Click chọn vào mỗi tấm ảnh để xem. Nhấn ENTER 2 lần để tạo ra các khoảng trắng. Vào menu Insert, chọn Web Component. Ở khung bên trái bấm chọn Photo Gallery. Ở khung bên phải chọn kiểu trình bày. Bấm Finish. Hộp thoại Photo Gallery Properties xuất hiện. Bấm Add, và bấm Pictures from Files. Dùng phím Shift để chọn nhiều ảnh liên tiếp trong danh sách tập tin. Bấm Open, và bấm OK. Trên thanh công cụ standard, bấm nút Save. Trong hộp thoại Save Embedded Files bấm OK. CHƯƠNG 5: XỬ LÝ NÂNG CAO VÀ XUẤT BẢN MỘT WEBSITE Trong chương này chúng ta sẽ được học thêm các chức năng xử lý nâng cao của một Webiste gồm có: Tạo liên kết đến các trang khác trong Website Tạo lề chung và thanh di chuyển Tạo và hiệu chỉnh theme Xem và thử Web site Tổ chức thư mục và tập tin Xuất bản lên World Wide Web. Tạo liên kết đến các trang khác trong Website Để tạo một liên kết đến một trang web khác, ngoài cách thức làm như trên, chúng ta còn có cách khác để tạo liên kết đến một trang Web khác như sau: Trên thanh công cụ, bấm Toggle Pane , sau đó bấm Folder List. Nhấp đúp chuột vào trang index.htm trong danh sách các trang đang xem trong Folder List Khi trang chủ hiển thị trong Page view, nhấn CTRL+END để đưa con nháy về cuối trang chủ. Tìm đến trang khoa_giày_da.htm trong danh sách trong Folder List. Bây giờ ta kéo trang khoa_giày_da.htm về phía dưới của trang chủ. FrontPage sẽ tự động tạo một hyperlink đến trang khoa_giày_da.htm trên trang chủ. Bấm và giữ chuột trên khoa_giày_da.htm trong Folder List, kéo thả vào trang chủ. FrontPage hiển thị một liên kết đến trang khoa_giày_da.htm. Lập lại các bước 4 và 5 để tạo các liên kết khác đến khoa_may_mặc.htm, khoa_thương_mại.htm, và tt_tin_học_ngoại_ngữ.htm. Đặt các liên kết kế tiếp nhau. Nhấn DOWN ARROW để thôi chọn hyperlink. Trang của chúng ta sẽ có dạng sau : Dĩ nhiên là chúng ta có thể thực hiện các thao tác như trên với các trang khác trong Web site, nhưng đó là một việc mất rất nhiều thời gian nếu có nhiều trang. Ngoài ra, nếu chúng ta quyết định thêm hay xoá trang khỏi Web site, chúng ta phải cập nhật lại các liên kết bằng cách thủ công như trên. FrontPage còn có một cách khác làm hay hơn để khởi tạo, quản lý và tự động cập nhật các liên kết trong toàn bộ Website. Bây giờ, chúng ta sẽ xoá đi các liên kết vừa tạo ở trên bằng chức năng Undo (bấm nút Undo trên thanh công cụ nhiều lần cho tới khi trả về trạng thái ban đầu) Tạo Shared Borders và thanh di chuyển (Navigation Bar) Shared borders (biên dùng chung) là các vùng trên trang Web được dùng để chứa các nội dung xuất hiện một cách ổn định trên tất cả các trang trong Web site. Các biên này chứa các banner, quảng cáo hoặc các nút di chuyển. Banner của trang có thể là tiêu đề trang sinh ra khi tạo trang, còn thanh di chuyển là các hàng hoặc cột chứa các liên kết chính của Web site. FrontPage có thể tự động cập nhật shared borders và navigation bars, sao cho cấu trúc của Website luôn luôn hoạt động tốt, ngay cả khi thêm, di chuyển, xoá trang. Tạo shared border của Web site Trong phần này chúng ta sẽ dùng các chức năng nâng cao của Frontpage để tạo ra một Website có tên là Sonadezi College Mở Frontpage, trên thanh công cụ standard, bấm Toggle Pane , rồi chọn Web Xuất hiện cửa sổ Web Site Templates. Chọn mục One Page Web Đổi tên thành Sonadezi College trong mục Specify the location of the new web Sau khi nhấp chọn OK sẽ xuất hiện màn hình như sau Chuyển qua chế độ Navigation View, tạo mới các trang Khoa Giày Da, Khoa May Mặc, Khoa Quản Trị- Kinh Doanh, Khoa Thương Mại, T.T Tin Học – Ngoại Ngữ, Diễn Đàn và Thời Khoá Biểu. Tắt hiển thị Folder List trong chế độ làm việc này. Trong menu Format, chọn Shared Borders. FrontPage hiển thị hộp thoại Shared Borders .Chú ý có 2 loại thanh di chuyển có thể gắn vào Trong hộp thoại Shared Borders, tạo các tùy chọn cho tất cả các trang. Phải bảo đảm rằng All pages đã được chọn. Đánh dấu Top và đánh dấu tiếp Include navigation buttons để chỉ định cho hiển thị trên đầu trang. Đánh dấu Left và đánh dấu tiếp Include navigation buttons để chỉ định cho hiển thị trên bìa trái trang. Bỏ trống Right và Bottom, và sau đó bấm OK. Lúc này FrontPage đã tạo shared borders và thanh di chuyển mặc nhiên cho tất cả các trang. Chuyển qua chế độ Page View, chúng ta sẽ thấy các định dạng của toàn bộ trang Web như sau . Sau đây, chúng ta sẽ học cách sửa đổi hình thức của thanh di chuyển cho phù hợp. Thử nghiệm hyperlink trên thanh liên kết Trong chế độ Navigation View, Nhấp đúp chuột vào trang chủ Home Page (index.htm). Tắt hiển thị Folder List trong chế độ làm việc này. Giữ CTRL và sau đó bấm hyperlink có tên Khoa May Mặc trên lề trái. FrontPage mở trang đích của liên kết, trong trang Khoa May Mặc, shared borders và thanh di chuyển cũng đã được chèn thêm vào đó. Tuy nhiên, trên trang này các liên kết chỉ tới các trang khác chỉ hiển thị trong lề trên (top). Đó là do FrontPage sử dụng cấu trúc site để xác định các cấp (level) của trang hiện hành. Mặc nhiên, shared border ở trên chỉ tới các trang cùn