Giao_trinh_Frontpage

Giáo trình fontpage Nguyễn Thành Nam
MỤC LỤC
Bài 1: BẮT ĐẦU VỚI FRONTPAGE 3
1. Không gian làm việc FrontPage 3
4
1.1 Menu (Thực đơn) 4
1.2 Thanh ToolBar 4
1.3 Màn hình soạn thảo 5
1.4 Các vùng điều khiển 5
2. Các lệnh đơn giản của FrontPage 5
2.1 Các lệnh làm việc với tệp (file) 5
2.2 Các lệnh soạn thảo 6
3. Ngôn ngữ HTML và tổng quan về trang Web 6
4. Tạo trang mới 7
5. Cất nội dung trang hiện thời vào file 8
6. Cất nội dung của trang tại FrontPage web hiện thời 8
7. Tạo trang mẫu 9
8. Mở một trang trong FrontPage Editor 9
9. Thuộc tính trang 10
9.1 Lựa chọn trên Margin 11
9.2 Lựa chọn Custom 11
1. Sự khác nhau giữa tài liệu Word và tài liệu HTML 12
2. Cấu trúc trang Web 13
3. Địa chỉ trang Web 14
4. Tạo màu nền, màu text và ảnh nền cho trang 14
1. Định dạng text 16
2. Đặt text lui vào so với lề của đoạn hiện thời (To indent text) 18
3. Đặt lề text lùi ra so với lề của đoạn hiện thời (To outdent text) 18
4. Làm việc với Paragraphs 19
4.1 Tạo một dòng mới mà không có khoảng trắng với dòng trên đó 19
4.2 Tạo một đoạn mới 19

4.3 Dóng lề cho đoạn 19
4.4 Thay đổi style cho đoạn 19
4.5 Chèn một ngắt dòng 20
4.6 Chèn kí tự đặc biệt 20
1. Tạo danh sách bullet 21
2. Tạo danh sách definition 22
3. Tạo danh sách directory 22
THCS Nâm N’Đir Trang
Giáo trình fontpage Nguyễn Thành Nam
4. Tạo danh sách menu 23
5. Tạo danh sách lồng nhau 23
6. Tạo danh sách có thứ tự 23
7. Thay đổi thông số của danh sách 23
Các loại siêu liên kết 25
1. Tạo các Text Link 26
1.1 Tạo text hyperlink từ FrontPage Explorer 26
1.2 Tạo text hyperlink tới trang mới 27

27
1.3 Tạo text hyperlink tới một trang trên World Wide Web 28
1.4 Tạo text hyperlink tới trang hoặc file trong FrontPage web hiện thời 28
2. Tạo Image Link 30
2.1 Tạo image hyperlink tới một trang mới 30
2.2 Tạo image hyperlink tới một trang trên World Wide Web 30
2.3 Tạo image hyperlink tới trang hoặc file trong FrontPage web hiện thời 31
3. Thay đổi HyperText và Hypermedia 31
3.1 Lần theo follow text hyperlink trở về sau (forward) 31
3.2 Lần theo image hyperlink về sau (forward) 32
3.3 Lần theo một hyperlink ngược về phía trước (backward) 32
4. Xoá và thay đổi các Hyperlink 32

4.1 Thay đổi text hyperlink 32
4.2 Thay đổi image hyperlink 32
4.3 Xoá text hyperlink 32
4.4 Xoá image hyperlink 33
4.5 Kiểm tra các hyperlinks 33
4.6 Sửa một hyperlink hỏng 33
4.7 Sắp đặt lại (recalculate) các hyperlinks 34
4.8 Tạo e-mail hyperlink 35
4.9 Tạo hyperlink tới file của Microsoft Word, Excel, hoặc PowerPoint 36
5. Bookmark 36
5.1 Tạo Bookmark 36
5.2 Tạo link với BookMark 37
5.3 Xoá Bookmark 37
5.4 Chuyển tới bookmark 37
1. Các loại ảnh được hỗ trợ trong HTML 39
2. Chèn một hình ảnh 40
2.1 Chèn ảnh từ một file 40
2.2 Chèn ảnh từ FrontPage web hiện thời 40
2.3 Chèn ảnh từ World Wide Web 41
2.4 Chèn clip art 41
2.5 Chèn một video clip 41
2.6 Cách chèn một video clip từ Microsoft Clip Gallery của Microsoft Office 97 42
3. Sửa ảnh 42
THCS Nâm N’Đir Trang
Giáo trình fontpage Nguyễn Thành Nam
3.1 Cách sử dụng các nút trên thanh công cụ Image 42
3.2 Thay đổi cách sắp đặt ảnh 43
3.3 Tạo thumbnail image 44
3.4 Tuỳ biến video clip 44
3.5 Thay đổi kích thước (Resample) file ảnh 45

3.6 Thay đổi kích thước ảnh 45
4. Tạo ảnh trong suốt 45
5. Chuyển đổi ảnh 46
5.1 Chuyển thành ảnh GIF 46
5.2 Chuyển thành ảnh JPEG 46
6. Các chức năng khác 47
6.1 Import ảnh vào FrontPage web 47
6.2 Chỉ định độ ảnh có độ phân giải thấp 48
6.3 Đặt hyperlink ngầm định cho ảnh 49
6.4 Tạo text thay thế cho ảnh 49
1. Tạo Hotspot 51
1.1 Tạo Circular Hospot 51
1.2 Tạo Polygon Hospot 51
1.3 Tạo Rectangle Hospot 51
1.4 Tạo Text Hospot 52
2. Thay đổi Hospot 52
2.1 Chọn hotspot 52
2.2 Highlight hotspot 52
2.3 Di chuyển hotspot 52
1. Tạo Table 53
2. Tạo bảng trong bảng khác 54
3. Thuộc tính của table 54
4. Điều chỉnh bảng 55
4.1 Chọn cả bảng hoặc một phần của nó 55
4.2 Chèn một ô 56
4.3 Chèn hàng hoặc cột 56
4.4 Phân tách ô 56
4.5 Trộn các ô 57
4.6 Dãn ô 57
4.7 Thay đổi kích thước bảng 58

4.8 Thay đổi kích thước ô 59
4.9 Phân bố các hàng và cột đều nhau 59
5. Xoá bảng và một phần của nó 60
5.1 Xoá ô, hàng, cột 60
5.2 Xoá bảng 60
5.3 Xoá caption của bảng 60
6. Định dạng table 60
6.1 Thay đổi màu nền của một hoặc nhiều ô 60
6.2 Thay đổi màu nền của bảng 60
THCS Nâm N’Đir Trang
III
Giáo trình fontpage Nguyễn Thành Nam
6.3 Bổ sung ảnh nền cho một ô 61
6.4 Bổ sung ảnh nền cho toàn bảng 61
6.5 Thay đổi màu các đường viền ô 62
6.6 Thay đổi màu đường viền bảng 63
6.7 Thay đổi hình dạng của ô 63
6.8 Thay đổi layout của bảng 63
7. Các thao tác khác 64
7.1 Bổ sung caption cho bảng 64
7.2 Sửa caption của bảng 64
7.3 Bổ sung tiêu đề ô 64
7.4 Chuyển bảng thành text 64
1. Tạo trang frame 66
1. Tạo Form 74
2. Thêm trường vào form 75
3. Thuộc tính của form 75
What to do with form results? 75
4. Sử dụng tạo form bằng Wizard 77
Contact Information: Thông tin để liên hệ với người sử dụng 78

Product Information: Thông tin sản phẩm 79
Personal Information: Thông tin cá nhân 80
One of several options: Lựa chọn duy nhất trong tuỳ chọn 80
Any of several option: Một vài lựa chọn trong tuỳ chọn 81
Boolean: Lựa chọn Có hoặc Không 81
Date: Kiểu dữ liệu nhập vào là ngày 81
Range: Kiểu dữ liệu trên form là một miền các giá trị để chọn lựa 81
Number: Dữ liệu nhập trên form là số 81
String: Dữ liệu nhập trên form là dòng text 81
Paragraph: Dữ liệu nhập là text nhiều dòng 81
1. Các thao tác với trường 84
1.1 Sao chép một trường 84
1.2 Xóa một trường trên form 84
1.3 Hiển thị trường xác nhận 84
2. Text Boxes 84
2.1 Tạo trường Text Box 84
2.2 Tạo trường mật khẩu 85
2.3 Thay đổi thuộc tính của trường text box 85
3. Scrolling Text Boxes 89
3.1 Tạo trường scrolling text box 89
3.2 Thay đổi thuộc tính của trường scrolling text box 89
3.3 Hạn chế giá trị nhập tại trường 90
4. Check Boxes 90
4.1 Tạo trường check box 90
4.2 Thiết lập thuộc tính cho trường check box 90
5. Radio Buttons 91
THCS Nâm N’Đir Trang
IV
Giáo trình fontpage Nguyễn Thành Nam
5.1 Tạo trường radio button 91

5.2 Thay đổi thuộc tính của trường radio-button 92
6. Drop-Down Menus 92
6.1 Tạo trường drop-down menu 93
6.2 Qui định việc nhập dữ liệu cho trường drop-down menu 95
7. Trường Push Buttons và Image 95
7.1 Tạo trường push button 95
7.2 Thay đổi thuộc tính của trường push button 96
7.3 Tạo trường Image 96
8. Trường ẩn - Hidden 97
1. Chèn một cấu thành FrontPage 99
1.1 Chú giải - Comment 99
1.1 Trường xác nhận – Confirmation Field 100
1.3 Hit Counter – Bộ đếm 100
1.4 Chèn trang - Included Page 100
1.5 Chèn mã HTML – Insert HTML 101
1.6 Ảnh với thời gian hiển thị đi kèm - Scheduled Image 101
1.7 Scheduled Include Page 102
1.8 Substitution 103
1.9 Page Banner 103
THCS Nâm N’Đir Trang
V
Giáo trình fontpage Nguyễn Thành Nam
Bài 1:
BẮT ĐẦU VỚI FRONTPAGE
Chào mừng các bạn khi đến với Microsoft FrontPage, một bộ công cụ
tạo và điều hành web site một cách lí tưởng mà người thiết kế không nhất
thiết phải biết những kiến thức về lập trình, FrontPage có mọi thứ mà bạn cần
để thiết kế và xây dựng trang Web và Web site cho bạn.
FrontPage bao gồm FrontPage Explorer, tại đây, bạn có thể tạo, thiết kế,
quản lí toàn bộ Web site và FrontPage Editor, nơi mà bạn có thể tạo và sửa

đổi các trang Web mà không cần phải biết ngôn ngữ đánh dấu siêu văn bản
(HTML). FrontPage bao gồm nhiều tính năng hỗ trợ cho việc tạo Web site
một cách dễ dàng nhất, chẳng hạn như bộ thư viện thiết kế đồ hoạ chuyên
nghiệp, một tập hợp đầy đủ các các wizard và các mẫu để tạo trang và
FrontPage web, những phần tử active cung cấp những chức năng và hàm phức
tạp mà không cần lập trình, và một danh sách các nhiệm vụ dành cho việc
kiểm soát và tạo FrontPage web.
Bạn có thể dùng FrontPage Explorer để tạo cấu trúc của Web site, áp
dụng các bố cục đồ hoạ cho trang, tổ chức các file và folder, nhập và xuất các
file, kiểm tra và so sánh các siêu liên kết, quản trị quyền truy nhập, giám sát
các nhiệm vụ, và đặc biệt là cho phép tiếp cận với FrontPage Editor để thiết
kế và sửa đổi nội dung của trang Web. Bạn có thể dùng FrontPage Explorer
để xuất bản các trang web trên máy tính của mình, trên một một tổ chức
intranet hoặc World Wide Web.
FrontPage Editor hỗ trợ cho bạn việc tạo, thiết kế và sửa đổi các trang
Web. Chẳng hạn như đưa text, ảnh, bảng, các mẫu biểu và các phần tử khác
nữa vào trang web, FrontPage Editor sẽ hiển thị chúng như khi chúng xuất
hiện trên trình duyệt. Mặc dù là một công cụ có tính năng hoàn hảo,
FrontPage Editor lại rất dễ dàng cho việc sử dụng bởi vì nó trở nên thân thiện
khi có giao diện của một trình xử lí văn bản. Bạn không cần phải học ngôn
ngữ HTML để sử dụng FrontPage Editor bởi vì nó có thể tạo mọi thẻ HTML
cho bạn, các thẻ mở rộng như style-sheet, frame, các điều khiển ActiveX.
Nếu bạn muốn soạn trực tiếp các mã lệnh HTML, bạn có thể sử dụng chế
độ view HTML của FrontPage. Trong chế độ này, bạn có thể vào text, soạn
THCS Nâm N’Đir Trang
Giáo trình fontpage Nguyễn Thành Nam
các thẻ HTML và các mã kịch bản, sử dụng các lệnh chuẩn của trình soạn
thảo văn bản như cắt, dán, tìm kiếm và thay thế.
FrontPage là một thành viên trong họ sản phẩm của Microsoft Office và
chia sẻ nhiều tính năng của Microsoft Word và Microsoft Excel, chẳng hạn

như thư viện ClipArt, kiểm tra lỗi chính tả và tạo bảng một cách dễ dàng.
Ngoài ra, FrontPage cũng quản lí các siêu liên kết được tạo trong tài liệu
Microsoft Office 97. Dưới đây là một vài đặc điểm của FrontPage Editor:
Bạn có thể tạo một trang HTML mơi dựa trên các wizard và template.
FrontPage Editor đưa ra nhiều lựa chọn về định dạng trang, và bạn có thể tạo
mẫu thiết kế của chính mình.
Bạn có thể áp dụng một hay nhiều các bố cụ đồ hoạ của FrontPage,
chúng được tạo bởi các nhà thiết kế chuyên nghiệp, tạo cho bạn các trang web
sống động và hấp dẫn. Bạn cũng có thể đưa vào và thiết kế viền trang, chèn
các thanh định hướng liên kết, giúp người sử dụng lướt trên Web site của bạn.
Bạn cũng có thể mở bất kì file HTML nào trong FrontPage Editor và
toànbộ tag của chúng sẽ được dịch và hiển thị trên màn hình của FrontPage
hoặc mở các file với nhiều khuôn dạng khác nhau và FrontPage Editor tự
động chuyển đổi chúng thành HTML, chẳng hạn như Microsoft Word,
Microsoft Excel, WordPerfect, FrontPage Editor tự động nhận ra các siêu
liên kết từ tài liệu Microsoft Office 97.
Bạn có thể chèn text trong mọi style HTML, tạo các danh sách đa cấp,
thay đổi kích thước và màu sắc của text, áp dụng các khuôn dạng cơ bản cho
text. Sử dụng style sheet, bạn có thể điều khiển lề, khoảng cách giữa các
dòng, màu sắc, font và kích thước của chữ.
Bạn có thể đưa các ảnh với bất kì định dạng nào, và FrontPage Editor tự
động chuyển đổi chúng sang dạng GIF hoặc JPEG. Kích đúp vào ảnh, bạn có
thể sử dụng chương trình tạo ảnh tương ứng. Bạn cũng có thể tạo ánh xạ ảnh
bằng cách thêm các Hotspot trên ảnh chứa siêu liên kết. Sử dụng các lệnh sửa
đổi ảnh, bạn có thể cắt xén, quay, thay đổi kích thước, tạo ảnh đen trắng, tạo
độ sáng tối cho ảnh. FrontPage cũng hỗ trợ một thư viện phong phú ClipArt,
các ảnh, và các video clip.
Bạn có thể tạo form chứa các trường text, check box, radio button, thực
đơn drop-down, và push button. Khi bạn tạo form, điều khiển form mặc định
THCS Nâm N’Đir Trang

Giáo trình fontpage Nguyễn Thành Nam
tự động cất thông tin trên form vào một file hoặc gửi chúng tới một địa chỉ e-
mail. Bạn có thể chọn một điều khiển từ tập các điều khiển form của
FrontPage hoặc thêm điều khiển của mình cho form.
Sử dụng các lệnh về tạo bảng, bạn có thể tạo, chèn hàng và cột, dóng lề
cho chúng, tạo màu nền,
Bạn có thể thêm các chức năng mạnh vào trang bằng cách chèn các cấu
thành FrontPage. Chúng sẽ thêm các khả năng tương tác chẳng hạn như thanh
định hướng, nhóm thảo luận, tìm kiếm, và điều khiển form. Ví dụ, cấu thành
mục lục (Table of Contents) tự động tạo outline của FrontPage web với các
siêu liên kết đến từng trang
Bạn có thể tạo một trang frame mới, thay đổi hiển thị của chúng và gán
trang khởi tạo cho mỗi frame. FrontPage hiển thị trang frame của bạn dưới
dạng những gì bạn nhìn thấy là những gì bạn có (WYSIWYG).
Bạn có thể chèn các điều khiển ActiveX, plug-ins, và các Java applet
trên FrontPage Editor. Bạn cũng có thể tiếp cận tới một phiên soạn các kịch
bản, tạo và chèn các kịch bản JavaScript và VBScript.
1. Không gian làm việc FrontPage
Không gian làm việc của FrontPage bao gồm hai phần chính trên màn
hình giao diện của nó, FrontPage Explorer và FrontPage Editor. Cả hai bao
gồm:
- Thực đơn
- Thanh công cụ
- Màn hình soạn thảo
- Các vùng điều khiển
FrontPage Explorer chỉ cho bạn các chế độ hiển thị khác nhau của
FrontPage web:
- Folders View
- All Files View
- Navigation View

- Hyperlinks View
THCS Nâm N’Đir Trang
Giáo trình fontpage Nguyễn Thành Nam
- Hyperlink Status View
- Themes View
- Tasks View
Màn hình làm việc của
FrontPage Editor:


1.1 Menu (Thực đơn)
Các thực đơn cơ bản của FrontPage bao gồm:
- File: các lệnh làm việc với file và tổng thể trên trang Web.
- Edit: Các lệnh soạn thảo thông dụng (tương tự các lệnh trong
mọi hệ soạn thảo văn bản khác ngoại trừ một vài lệnh đặc thù).
- View: Hiển thị các thanh công cụ.
- Go: Các lệnh sắp xếp các đối tượng đồ họa tương đối với nhau.
- Insert: Chèn các đối tượng vào trang Web.
- Format: Các lệnh tạo khuôn.
- Tools: Các công cụ và lựa chọn.
- Table: Các lệnh tạo bảng trên trang.
- Frame: Các lệnh làm việc với Frame.
- Windows, Help: Các thực đơn truyền thống của Windows.
1.2 Thanh ToolBar
FrontPage có một số ToolBar có thể hiện hoặc ẩn trên màn hình.
Các lệnh trong thực đơn View dùng để làm ẩn hoặc hiện các Toolbar này.
THCS Nâm N’Đir Trang
Giáo trình fontpage Nguyễn Thành Nam
Một hình ảnh đầy đủ của các ToolBar
1.3 Màn hình soạn thảo

Màn hình soạn thảo nằm ở trung tâm. FrontPage có hai chế độ soạn thảo
cho mỗi trang (file) Web: Normal và HTML.
Chế độ Normal là chuẩn và là mặc định của FrontPage. Trong chế độ
HTML, FrontPage cho phép làm việc trực tiếp với các Tag theo chuẩn của
HTML. Kết hợp hài hòa giữa hai chế độ soạn thảo này sẽ tạo ra các trang
Web vừa ý.
Chế độ Preview cho phép xem trực tiếp kết quả của trang Web trên các
browser mà không cần phải có thêm các phần mềm này.
1.4 Các vùng điều khiển
Bao gồm các nút điều khiển cửa sổ, thanh cuốn và dòng trạng thái.
2. Các lệnh đơn giản của FrontPage
Các nhóm lệnh sau trên trang soạn thảo FrontPage có ý nghĩa và kết quả
tương tự như đối với các phần mềm soạn thảo khác (ví dụ WinWord, Lotus
WordPro, ).
2.1 Các lệnh làm việc với tệp (file)
Các lệnh trên thực đơn File hoặc trên Standard Toolbar: New, Open,
Close, Save, Save As, Page Setup, PrintPreview, Print.
THCS Nâm N’Đir Trang
Giáo trình fontpage Nguyễn Thành Nam
2.2 Các lệnh soạn thảo
Các lệnh soạn thảo cơ bản trên thực đơn Edit: Copy, Cut, Paste, Clear
(delete), Select All, Find, Replace
3. Ngôn ngữ HTML và tổng quan về trang Web
Thông tin chính mà chúng ta truy nhập trên dịch vụ World Wide Web là
các trang Web. Trang là tài liệu cơ bản trên dịch vụ World Wide Web. Chúng
được viết theo một ngôn ngữ gọi là ngôn ngữ đánh dấu siêu văn bản
Hypertext Markup Language –HTML. Một trang HTML bao gồm text và các
tag của HTML được nhúng trong tài liệu, các tag này cung cấp thông tin về
cấu trúc trang, hình thức hiển thị và nội dung của nó. Thực chất, một tài liệu
HTML là một file được lưu dưới dạng .htm hoặc .html mà nội dung của nó

tuân theo nguyên tắc của ngôn ngữ HTML.
Ngôn ngữ HTML (Hyper Text Markup Language) là tập hợp các
nguyên tắc và qui định dùng để mô tả và thể hiện các trang Web. Các qui tắc
này được thể hiện thành những "Tag" được chèn vào các vị trí thích hợp của
trang Web. Các tag này sẽ qui định cách mà dữ liệu sẽ hiển thị trên trình
duyệt. Một tag HTML bao gồm hai phần: phần mở và phần đóng tag (phần
này là tuỳ chọn).
Dữ liệu nằm sau phần mở sẽ chịu ảnh hưởng của tag, có nghĩa là nó sẽ
xuất hiện với hiệu ứng phụ thuộc vào các thuộc tính đi kèm với tag.
Một vài tag HTML xây dựng một đặc tả về cấu trúc các phần tử của
trang, chẳng hạn như bảng và mẫu biểu, những phần tử này được tạo bởi từ
nhiều phần tử. Trình duyệt Web (chương trình hiển thị các trang Web) sử
THCS Nâm N’Đir Trang
Các trang miêu
tả hàng, các ô
của bảng
Các trang miêu
tả hàng, các ô
của bảng
Giáo trình fontpage Nguyễn Thành Nam
dụng những thông tin này để nhận ra cách mà dữ liệu hiển thị dựa trên mối liên
hệ giữa các phần tử này.
Ví dụ, tag HTML đặc tả bảng miêu tả số dòng, số cell trên một dòng,
Hiển thị của tag bảng trên trình duyệt
Các tag HTML cũng cung cấp các thuộc tính đi kèm với giá trị. Ví dụ,
tag dùng để chèn ảnh tại trang có một thuộc tính chỉ ra tên của file ảnh cần
chèn. Một vài thuộc tính cung cấp các giá trị tham chiếu về sự hiển thị của
phần tử trên trang. Ví dụ, bảng có những thuộc tính mô tả độ dày và khoảng
cách giữa các ô
Để trợ giúp bạn thiết kế trang được nhanh chóng, FrontPage hỗ trợ hơn 50

bài trí thiết kế chuyên nghiệp, chúng sẽ giúp bạn trang trí những trang Web của
mình bằng những phần tử có sẵn như bullet, font, ảnh, thanh định hướng
4. Tạo trang mới
1. Tại FrontPage Editor, thực hiện lệnh File/New. Hiển thị hộp hội thoại
New.
2. Chọn Page, chọn template hoặc wizard để tạo trang mới, mẫu thu nhỏ
của chúng xuât hiện trên vùng Preview.
THCS Nâm N’Đir Trang
Giáo trình fontpage Nguyễn Thành Nam
3. Kích OK.
5. Cất nội dung trang hiện thời vào file
1. Tại FrontPage Editor, thực hiện lệnh File/Save As.
2. Kích nút File .
3. Tại hộp hội thoại Save As, chọn ổ đĩa và thư mục để cất trang.
4. Gõ tên file trong hộp File Name và kích OK.
5. Kích OK khi xuất hiện hộp hội thoại với danh sách các phần tử như tranh
ảnh, âm thanh, các điều khiển ActiveX và những phần tử khác chứa trong
trang.
6. Cất nội dung của trang tại FrontPage web hiện thời
1. Nếu trang được mở từ web hiện thời hoặc từ World Wide Web, tại
FrontPage Editor, thực hiện lệnh File/Save. Nếu trang được mở từ một
file, để cất dưới tên khác, thực hiện lệnh File/Save As.
THCS Nâm N’Đir Trang
Mẫu tương
ứng xuất
hiện trên
Preview
Chọn vị trí
để cất nội
dung trên

trang
Giáo trình fontpage Nguyễn Thành Nam
2. Nếu là lần đầu cất trang tại FrontPage web, gõ tiêu đề trang tại Title.
3. Gõ URL tương đối tới gốc của FrontPage web đang mở hiện thời, hoặc
chấp nhận URL mặc định của FrontPage. Ví dụ, nếu bạn gõ tại URL là
music/index.htm, trang sẽ được cất tại folder Music là con trực tiếp của
folder gốc của FrontPage web hiện thời và kích OK.
4. Kích OK khi xuất hiện hộp hội thoại với danh sách các phần tử như tranh
ảnh, âm thanh, các điều khiển ActiveX và những phần tử khác chứa trong
trang.
7. Tạo trang mẫu
Trong FrontPage Editor, bạn có thể cất một trang dưới dạng mẫu. Sau đó,
mẫu này sẽ được hiển thị cùng với mẫu trang FrontPage chuẩn tại hộp hội thoại
New.
1. Thực hiện lệnh File/Save As.
2. Chọn As Template.
3. Tại hộp hội thoại Save As Template, gõ tiêu đề trang tại Title, tên trang
tại Name, đặc tả ngắn cho trang tại Description.
4. Kích OK.
8. Mở một trang trong FrontPage Editor
1. Thực hiện lệnh File/Open.
2. Tại hộp hội thoại Open, thực hiện một trong các bước dưới đây:
THCS Nâm N’Đir Trang
Vào tiêu đề
và URL
tương đối
của trang
Giáo trình fontpage Nguyễn Thành Nam
- Mở một trang trên FrontPage web hiện tại, kích chọn một trang. Để xem
nội dung của folder, kích đúp vào folder này và chọn trang trong đó.

Kích OK.
- Mở một trang từ hệ thống file của bạn, kích nút File, và chọn file
mà bạn muốn từ hộp hội thoại Select File.
- Mở một file từ World Wide Web, chọn nút World Wide Web .
FrontPage khởi tạo trình duyệt Web, chuyển đến trang mà bạn
muốn mở và trở lại ứng dụng FrontPage. Vị trí của trang mà bạn đã
xem được hiển thị tại URL của hộp hội thoại Open. Kích OK để mở
trang.
9. Thuộc tính trang
Thực hiện lệnh File/Page Properties. Xuất hiện hộp hội thoại
Các tuỳ chọn của hộp hội thoại Page Properties:
Tại General:
- Location: URL đầy đủ của trang. Nếu trang được mở từ một file,
URL bắt đầu bởi “File://”. Nếu trang chưa được cất, URL sẽ là
“FrontPage:///Editor/New Page n.htm.”
- Title: Tiêu đề của trang.
- Base Location: URL cơ sở của trang.
- Default Target Frame: Nếu bạn muốn mọi đích liên kết của trang
được hiển thị trên một frame khác của một trang frame, gõ tên của
THCS Nâm N’Đir Trang
10
Giáo trình fontpage Nguyễn Thành Nam
đích frame mặc định, hoặc kích vào nút Target Frame để chọn frame
đích.
- Nếu siêu liên kết không được đặc tả tới một frame đích khác, trang
đích của siêu liên kết sẽ được hiển thị tại frame đích mặc định.
Background Sound:
- Location: Gõ tên của file âm thanh nền cho trang. Trình duyệt
Web sẽ chạy file này khi trang được hiển thị. Bạn có thể đặc tả
một file trên FrontPage web hiện tại hoặc từ hệ thống file của bạn.

- Browse: Kích nút này để duyệt file trong FrontPage web hiện tại
hoặc tại hệ thống file.
- Loop: Gõ số lần lặp lại của file âm thanh này.
- Forever: Chọn để đặt chế độ chạy file âm thanh cho đến khi trang
không được hiển thị nữa.
- Style: Kích nút này để thay đổi thuộc tính style sheet cho phần tử
được chọn. Khuôn dạng của Style-sheet cho phép điều khiển
khoảng cách, lề, font, màu sắc mà với những thuộc tính của
HTML cơ bản, bạn không thể điều khiển được.
9.1 Lựa chọn trên Margin
Đặc tả các thuộc tính để điều khiển lề của trang. Nếu trang hiện thời sử
dụng chung đường viền, lề thiết lập được áp dụng cho những cạnh chung
đường viền (thay cho cạnh của trang).
Specify Top Margin: Chọn lề trên và lề dưới cho trang bằng điểm.
Specify Left Margin: Chọn lề trái và lề phải cho trang bằng điểm.
9.2 Lựa chọn Custom
Tại đây thiết lập các tag meta (biến hệ thống và biến được định nghĩa bởi
người sử dụng), chúng sẽ có ảnh hưởng tới trang hiện thời.
System Variables (HTTP-EQUIV): Phần này liệt kê các tag meta dùng
thuộc tính HTTP-EQUIV như một phần cặp tên và giá trị. Những tag này cung
cấp những giới thiệu đặc biệt tới trình duyệt, chẳng hạn như thời hạn hiển thị
hoặc nạp lại của trang.
THCS Nâm N’Đir Trang
11
Giáo trình fontpage Nguyễn Thành Nam
- Name: Tên của tag
- Value: Giá trị tương ứng với tag
- Add: Kích nút này để thêm tag mới
- Modify: Kích nút để sửa thuộc tính của tag được chọn
- Remove: Kích nút này để bỏ tag được chọn

- User Variables: Phần này liệt kê các tag meta do người sử dụng định
nghĩa.
Bài 2:
LÀM VIỆC VỚI TRANG WEB
FrontPage Editor là công cụ giúp cho việc tạo các trang Web một cách
dễ dàng mà không đòi hỏi ở bạn kiến thức về ngôn ngữ HTML. Trang Web là
những đơn vị thông tin cơ bản mà người dùng truy cập trên dịch vụ WWW,
chúng được tạo ra dựa theo ngôn ngữ đánh dấu siêu văn bản HTML. Chính vì
vậy, để tạo giao diện thuận tiện cho người thiết kế khi tạo trang Web,
FrontPage Editor cung cấp các chế độ hiển thị khác nhau, bao gồm:
- Normal: Đây là chế độ hiển thị nội dung của trang Web khi bạn đang
tạo và chỉnh sửa nó
- HTML: Chế độ hiển thị trang Web dưới các mã tag HTML
- Preview: Xem trước nội dung của trang Web ngay tại ứng dụng
FrontPage mà không nhờ trình duyệt
Để chuyển giữa các chế độ hiển thị
Kích chuột vào nút tương ứng phía dưới ở màn hình FrontPage Editor.
1. Sự khác nhau giữa tài liệu Word và tài liệu HTML
Việc tạo các trang Web tại chế độ hiển thị Normal sẽ trở nên thân thiện
khi bạn đã sử dụng họ sản phẩm soạn thảo trong bộ Office của Microsoft.
Thuật ngữ “WYSIWYG” chứng tỏ phần nào việc dễ sử dụng các công cụ của
FrontPage Editor trong việc thiết kế các trang Web.
THCS Nâm N’Đir Trang
12
Giáo trình fontpage Nguyễn Thành Nam
Với giao diện không khác gì lắm màn hình soạn thảo thông thường (với
những ứng dụng kiểu như Microsoft Word), bạn hoàn toàn có thể tạo các
trang HTML dễ dàng như việc tạo trang soạn thảo vậy.
Tuy việc hiển thị nội dung của trang HTML và trang soạn thảo Word
trong hai ứng dụng tương ứng là Word và FrontPage Editor không khác nhau

lắm, nhưng về thực chất thì thông tin chứa đựng trong chúng là khác hẳn.
Những trang tài liệu được tạo bởi Word bao gồm thực sự những thông tin mà
tài liệu đó sẽ hiển thị. Chúng được lưu dưới một khuôn dạng riêng, phân biệt
với các tài liệu của ứng dụng khác, tại đó, thông tin được lưu sẽ có cấu trúc liên
quan với nhau một cách nhất định. Chẳng hạn, trang tài liệu Word hiển thị một
bức ảnh (không có liên kết) cùng với text đi kèm, tài liệu đó được cất dưới một
file, trong file này, ngoài những thông tin đặc trưng cho khuôn dạng của file
Word (thường nằm trong phần đầu của file) còn có những thông tin về text và
ảnh đã nói ở trên. Và như vậy, dung lượng của file Word cũng phụ thuộc vào độ
lớn các thông tin mà chúng hiển thị.
Với tài liệu HTML thì khác. Thực chất, tài liệu HTML là một file dạng
text, bạn có thể xem nội dung của nó bằng các ứng dụng soạn thảo thông
thường. Nội dung của nó khi đọc bởi các trình soạn thảo dạng này sẽ bao gồm
các tag HTML đi kèm với nó là text (sẽ được hiển thị) và các thông số cùng
các giá trị đi kèm. Những cặp thuộc tính và giá trị này bổ sung cho tag, và toàn
bộ thông tin này sẽ được trình duyệt giải mã để hiển thị dữ liệu theo cách mà tài
liệu HTML chỉ định.
Vậy, sự khác biệt lớn giữa tài liệu Word và tài liệu HTML là ở chỗ,
trang Word thực sự chứa thông tin mà nó hiển thị, còn trang HTML chỉ chứa
những thông tin dạng text và chỉ ra cách mà dữ liệu được hiển thị trên trình
duyệt. Và vì vậy, trình duyệt chỉ hiểu khuôn dạng của tài liệu HTML mà thôi.
2. Cấu trúc trang Web
Trang Web bao gồm những phần sau:
Phần đầu trang: Thường nằm trong cặp tag <HEAD> và </HEAD>.
Phần này thông thường được tự động tạo khi thiết kế trang. Tuy nhiên, bạn có
thể thay đổi các thông số của trang tại phần này bằng cách dùng lệnh
THCS Nâm N’Đir Trang
13
Giáo trình fontpage Nguyễn Thành Nam
File/Page Properties và chọn General, Language, hoặc Custom để vào các

thông số, các tag cần thiết (mà FrontPage chưa hỗ trợ).
Phần thân: Nằm trong cặp tag <BODY> và </BODY> của HTML.
Tương ứng với phần này của tài liệu HTML, chúng được hiển thị tại chế độ
Normal gần giống như cách mà chúng hiển thị trên trình duyệt.
Phần không có ở HTML chuẩn: Đây là những chương trình, những
kịch bản, những plug-in được nhúng trong tài liệu HTML. Chúng hỗ trợ cho
việc tạo các trang Web động và tất nhiên sẽ không được nhắc đến kĩ trong tài
liệu này.
3. Địa chỉ trang Web
Một trang Web là một tài nguyên trên dịch vụ WWW của Internet, chính
vì vậy, để truy cập đến nó, bạn phải biết:
Vị trí của máy chủ chứa trang Web này, thực chất đây chính là
địa chỉ IP của Web site
Đường dẫn đến trang web tại máy chủ này
Tên giao thức của dịch vụ mà bạn đang truy nhập: http
Khuôn dạng tổng quát của địa chỉ một trang Web như sau:
http://địa chỉ IP của máy chủ/tên thư mục/ /tên tài liệu HTML
Chẳng hạn: />4. Tạo màu nền, màu text và ảnh nền cho trang
Thực hiện các bước sau:
Thực hiện lệnh Format/Background.
THCS Nâm N’Đir Trang
14
Giáo trình fontpage Nguyễn Thành Nam
- Specify Background and Colors: Phần này chứa các thông tin điều
khiển màu nền cho trang.
- Background Image: Chọn check box này để sử dụng một ảnh nền. Ảnh
sẽ trải theo dạng lát gạch trên nền trang. Gõ tên của đường dẫn đến file
ảnh hoặc kích nút Browse để tìm file này.
- Watermark: Chọn để hiển thị ảnh như một “watermark”.
- Properties: Kích nút này để mở hộp hội thoại Image Properties để xem

hoặc sửa thuộc tính của ảnh nền. Bạn chỉ có thể xem thuộc tính của ảnh
tại FrontPage web hiện tại mà thôi.
- Background: Đặc tả màu nền của trang bằng cách chọn màu từ danh
sách. Để chọn một màu chưa xuất hiện trên danh sách, kích Custom và
chọn một màu tại hộp hội thoại Color.
Chú ý: Bạn có thể kết hợp ảnh nền với màu nền. Nếu ảnh nền có màu
trong, màu nền sẽ hiển thị qua ảnh.
- Text: Đặc tả màu của text trên trang bằng cách chọn màu từ danh sách.
- Hyperlink: Đặc tả màu của siêu liên kết trên trang.
- Visited Hyperlink: Đặc tả màu liên kết đã được tham chiếu đến.
- Active Hyperlink: Đặc tả màu của siêu liên kết đang kích hoạt.
- Get Background and Colors From Page: Chọn nền và màu từ một
trang khác bằng cách gõ đường dẫn đến trang tại đây hoặc kích nút
Browse để tìm trang.
THCS Nâm N’Đir Trang
15
Giáo trình fontpage Nguyễn Thành Nam
Bài 3:
ĐỊNH DẠNG TEXT VÀ ĐOẠN
FrontPage Editor cung cấp một giao diện soạn thảo text đầy đủ. Sử
dụng các lệnh trên thực đơn, các nút trên thanh công cụ, các phím nóng, bạn
có thể định dạng cho text, cắt, sao chép và dán text, nhúng các đoạn, tạo
danh sách và một số công việc tương tự như trình soạn thảo văn bản khác
nữa. FrontPage Editor hiển thị trang web giống như trang được hiển thị trên
trình duyệt dưới cấu trúc thẻ của HTML.
Nếu một bố cục được áp dụng cho trang, thuộc tính của kiểu đoạn,
chẳng hạn như font, kích thước, màu sắc, kiểu danh sách bullet và number, lề
được thiết lập bởi bố cục đó. Bạn có thể áp dụng kiểu của đoạn, chẳng hạn
như Heading 1 hoặc Body Text từ danh sách style đã có.
Nếu trang không dùng bố cục có sẵn, bạn có thể thiết lập kiểu

paragraph khi bạn tạo và thay đổi nó.
Ký tự thường có thuộc tính mặc định dựa trên khuôn dạng của đoạn
chứa chúng. Bạn có thể thiết lập thuộc tính cho những kí tự mà bạn muốn
như điều khiển màu, kích thước, độ đậm, chỉ số trên, chỉ số dưới và những
thuộc tính khác nữa.
1. Định dạng text
1. Tại FrontPage Editor, chọn text, sau đó thực hiện lệnh Format/Font
2. Vào các lựa chọn như sau:
- Chọn Font, xuất hiện hộp hội thoại Font:
THCS Nâm N’Đir Trang
16
Giáo trình fontpage Nguyễn Thành Nam
- Chọn Special Style để chọn các khuôn dạng khác cho kí tự:
- Citation (<cite>): Định dạng cho text là tên của sách, một bài hát, tên
tác giả, hoặc một trích dẫn nào đó.
- Sample (<samp>): Định dạng cho text là kí tự chữ.
- Definition (<dfn>): Định dạng cho các định nghĩa, thường hiển thị là chữ
nghiêng.
- Blink (<blnk>): Định dạng text nhấp nháy.
- Code (<code>): Định dạng text là mã lệnh máy tính.
- Variable (<var>): Định dạng text là tên biến, thường hiển thị là chữ
nghiêng.
THCS Nâm N’Đir Trang
Chọn các
thuộc tính
kiểu kí tự
(Font Style),
kích thước
(Size), màu
(Color)

Chọn Font
Chọn các hiệu
ứng cho kí tự
Thiết lập các thuộc
tính của Style cho
kí tự
Lựa chọn các kiểu
text đặc biệt
17
Giáo trình fontpage Nguyễn Thành Nam
- Bold (<b>): Định dạng chữ đậm.
- Italic (<i>): Định dạng chữ nghiêng.
- Keyboard (<kbd>): Định dạng text là dữ liệu cần nhập từ bàn phím
bởi người sử dụng.
- Vertical Position: Chọn Superscript để text có dạng chỉ số trên hoặc
Subscript để text có dạng chỉ số dưới.
- By: Vào số điểm mà text có dạng chỉ số sẽ cao hơn hoặc thấp hơn với
dòng text bình thường.
- Style: Kích nút này để vào các thông số về style cho text.
3. Kích OK để áp dụng những định dạng vừa thiết lập cho text.
2. Đặt text lui vào so với lề của đoạn hiện thời (To indent text)
1. Tại FrontPage Editor, chọn text muốn indent.
2. Kích nút Increase Indent .

3. Đặt lề text lùi ra so với lề của đoạn hiện thời (To outdent text)
1. Tại FrontPage Editor, chọn text muốn outdent.
2. Kích nút Decrease Indent button .
THCS Nâm N’Đir Trang
Kích nút
Increase

Indent
18
Giáo trình fontpage Nguyễn Thành Nam

4. Làm việc với Paragraphs
4.1 Tạo một dòng mới mà không có khoảng trắng với dòng trên đó
Nhấn Shift + Enter.
4.2 Tạo một đoạn mới
- Để tạo một đoạn mới với cùng kiểu với đoạn hiện tại, đặt điểm chèn tới
cuối đoạn trên và nhấn Enter.
- Để chia nhỏ đoạn hiện tại, đặt điểm chèn tại vị trí muốn chia trong đoạn
và nhấn Enter.
4.3 Dóng lề cho đoạn
1. Tại FrontPage Editor, đặt trỏ text tại một vị trí trên đoạn.
2. Thực hiện một trong các bước sau:
- Để dóng lề trái, kích nút Align Left .
- Để dóng lề phải, kích nút Align Right .
- Để căn lề giữa, kích nút Align Left .
4.4 Thay đổi style cho đoạn
Tại FrontPage Editor, thực hiện một trong các bước dưới đây:
- Để áp dụng bất kì style hiện có nào, đặt trỏ text tại một vị trí trên đoạn
và chọn một style tại hộp Change Style.
- Để áp dụng nhanh kiểu danh sách bullet, đặt trỏ text tại một vị trí trên
đoạn, nhấn nút Bulleted List .
THCS Nâm N’Đir Trang
Kích
nút này
Kích
nút này
19

Giáo trình fontpage Nguyễn Thành Nam
- Để áp dụng nhanh kiểu danh sách có số thứ tự, đặt trỏ text tại bất kì
vị trí nào trong đoạn, kích nút Numbered List .
4.5 Chèn một ngắt dòng
1. Tại FrontPage Editor, thực hiện lệnh
Insert/ Line Break.
2. Tại hộp hội thoại Break Properties,
chọn kiểu ngắt dòng.
- Không xóa lề phải hoặc trái, chọn Normal Line Break
- Để xóa lề trái, chọn Cleart Left Margin
- Để xóa lề phải, chọn Clear Right Margin
- Xoá cả lề phải và trái, chọn Clear Both Margins.
3. Kích OK.
4.6 Chèn kí tự đặc biệt
1. Tại FrontPage Editor, thực hiện lệnh Insert/ Symbol.
2. Chọn một kí tự muốn chèn, nhấn Insert, kích nút Close.
THCS Nâm N’Đir Trang
Kí tự muốn chèn
20