Danh thiếp Địa chỉ và Liên kết E-Mail
Trong bài này bạn sẽõ tạo ra một trang web đúng mốt -- tóm lược bằng một đoạn cuối! Hãy để cho mọi người gởi đến bạn một e-mail ngay từ trong trang Web của bạn!
Mục đích
Sau bài học này bạn có thể:- Thêm một đoạn cuối (stylized footer) vào cuối trang Web.
- Tạo một liên kết siêu văn bản để gởi e-mail
Bài học
Lưu ý: Nếu bạn không có tài liệu từ những bài học trước bạn có thể download ngay bây giờ. Một đặc điểm đáng giá của những trang Web là "footer" ở cuối của một trang để cung cấp thông tin về tác giả và tài liệu, có thể là ngày được cập nhật cuối cùng, cũng như là để gởi tới tác giả một thông báo bằng e-mail.Đây chính là nơi để đặt tag address mà trong đó khối văn bản được in trong dòng mới dưới kiểu chữ nghiêng.
Thật là một ý tưởng hay để trong footer có một mô tả ngắn gọn, thông tin và quan hệ giữa những trang Web của bạn. Môt vài thông tin hữu ích là:
- Tiêu đề hay chủ đề của trang hiện thời.
- Ngày nó được tạo ra và cập nhật.
- Chủ quyền thích đáng.
- Tên và e-mail cho tác giả của trang Web.
- Tên và liên kết siêu văn bản tới nguồn gốc/tổ chức.
Dạng HTML của tag address trông giống như sau :
<address>
text text text text text text text text text
text text text text text text text text text
</address>
Lưu ý rằng tất cả những HTML khác bên trong tag address đều hợp lệ,
vì thế chúng ta có thể sửa đổi nó với những tag in đậm, ngắt dòng và một tag
liên kết siêu văn bản:
HTML | Kết quả |
---|---|
<address>
<b>Page Title</b><br>
Last Updated February 31, 1999<br>
Web Page by Alan Levine
(levine@maricopa.edu) <br>
<a href="http://www.mcli.dist.maricopa.edu/">
Maricopa Community Colleges</a><br>
</address>
|
Page Title Last Updated February 31, 1999 Web Page by Alan Levine (levine@maricopa.edu) Maricopa Community Colleges |
Cách để làm điều này là tạo một liên kết siêu văn bản với loại là mailto trong URL (hãy xem lại bài 8b). Tạo một liên kết siêu văn bản như sau:
<a href="mailto:levine@maricopa.edu">send an e-mail to alan</a>
Khi nhấn vào dòng chữ send an e-mail to alan, Web browser sẽ mở ra một
màn hình để bạn có thể soạn một thông báo và gởi nó đến cho tôi. Hơn nữa, bạn còn
có thể thêm một dòng chủ đề mặc nhiên (subject) cho thông báo e-mail:
<a href="mailto:levine@maricopa.edu? subject=hi from lesson 12">
send an e-mail to alan</a>
Hãy thử đi! Hãy gởi cho tôi một thông báo!
send an e-mail to alan
Lưu ý rằng bạn có thể làm cho bất kỳ một dòng chữ (hay hình ảnh) nào hoạt động như
là một liên kết siêu văn bản. Vì vậy trong ví dụ vừa rồi, chúng ta
sẽ sửa đổi HTML để có một địa chỉ internet tạo liên kết cho việc gởi e-mail.
HTML | Kết quả |
---|---|
<address>
<b>Page Title</b><br>
Last Updated February 31, 1999<br>
Web Page by Alan Levine
<A HREF="mailto:levine@maricopa.edu">
(levine@maricopa.edu)</A> <br>
<a href="http://www.mcli.dist.maricopa.edu/">
Maricopa Community Colleges</a><br>
</address>
|
Page Title Last Updated February 31, 1999 Web Page by Alan Levine (levine@maricopa.edu) Maricopa Community Colleges |
Và cuối cùng chúng tôi đề nghị rằng bạn cũng nên đặt URL của trang vào trong footer. Tại sao vậy? Khi một ai đó in ra trang Web của bạn nhưng chưa viết lại hoặc lưu lại URL trong bookmark, có URL trên trang giấy cho phép một sự tham khảo bằng tay. Chỉ việc điều chỉnh ví dụ trên một chút (hãy chú ý đoạn HTML này ở dưới tag <address>...</address>): | |
<address>
<b>Page Title</b><br>
Last Updated February 31, 1999<br>
Web Page by Alan Levine
<A HREF="mailto:levine@maricopa.edu">
(levine@maricopa.edu)</A> <br>
<a href="http://www.mcli.dist.maricopa.edu/">
Maricopa Community Colleges</a><br>
</address>
<p>
<tt>
URL: http://www.mcli.dist.maricopa.edu/tut/
</tt>
|
Page Title Last Updated February 31, 1999 Web Page by Alan Levine (levine@maricopa.edu) Maricopa Community Colleges URL: http://www.mcli.dist.maricopa.edu/tut/ |
- Mở tập tin HTML index.htm trong trình soạn thảo của bạn.
- Tại cuối trang Web (nhưng trên những tag </body></html>), thêm:
<HR> <address><B>Volcano Web</B> <br> created by Lorrie Lava, <A HREF="mailto:lava@pele.bigu.edu"> lava@pele.bigu.edu</A><br> Volcanic Studies, <A HREF="http://www.bigu.edu/">Big University</A><p> <TT>last modified: April 1, 1995</TT> </address> <p> <tt>URL: http://www.bigu.edu/web/index.htm</tt>
Lưu ý: Chúng ta đã sử dụng một vài tag HTML mà đã được xét đến trong các bài trước. Cũng nên lưu ý đến tag <p> ở cuối trang; điều này chắc chắn rằng dòng cuối của văn bản luôn luôn được thấy rõ.
- Lưu trữ và Reload tập tin HTML.
Kiểm tra lại công việc của bạn
So sánh tài liệu của bạn với ví dụ mẫu. Nếu tài liệu của bạn trông khác với mẫu, hãy xem lại văn bản bạn đã nhập trong trình soạn thảo.Xem lại
Xem lại những chủ đề sau:- Tag address dùng để làm gì?
- Tag address phải ở cuối một trang phải không?
- Làm thế nào bạn tạo một tag để gởi e-mail đến bạn? hoặc đến một người khác? hoặc cùng với dòng chủ đề?