Huong dan tao Code HTML

Như đã nói trong những trang đầu, trên thị trường Internet tồn tại nhiều loại trình duyệt khác nhau (chủ yếu là Microsoft Internet Explorer và Netscape Navigator, Communicator) và khôn[r]

(1)

Trang [1] [2]

HƯỚNG DẪN NHẬP MƠN HTML

Bài trình bày bí ẩn ngơn ngữ đánh dấu siêu văn (HTML), thực chất chẳng có bí ẩn Nếu biết cách dùng trình xử lý văn bản, bạn tạo trang Web vài phút

Nhờ xây dựng văn đồ hoạ, World Wide Web (WWW) đưa Internet nhập vào dịng chảy sống Nhưng tính hấp dẫn WWW vượt xa nhiều so với giao diện đồ hoạ, lôi nhiều người dùng PC không rành kỹ thuật Nhờ HTML tương đối đơn giản nên nhiều người bình thường tạo Web site đầy ấn tượng Nếu bạn khao khát muốn đưa lên Web, tất điều mà bạn cần có tài khoản đăng ký với hãng cung cấp Web, bí HTML, chút óc sáng tạo

Bài báo đưa bạn chuyến du lịch trang Web điển hình, để bạn thấy thực Đặc biệt, bạn giới thiệu phần tử cấu tạo nên HTML (Hypertext Markup Language - Ngôn ngữ đánh dấu siêu văn bản) - linh hồn trang Web Và trường hợp dự định tạo Web site riêng cho mình, bạn có thêm hiểu biết xảy bạn nối vào Web xem trang ưa thích

HTML: Ngơn ngữ đánh dấu:

Sau lóng ngóng với vài trang Web du lịch Internet, bạn nghĩ phải có gói phần mềm tinh vi để thu tất hiệu ứng trang trí đầy quyến rũ Mặc dù có số cơng cụ dành cho người say mê HTML thực sự, bạn dùng trình soạn thảo văn Notepad Windows để tạo trang Web hấp dẫn

Sự thật hầu hết trang khơng có khác ngồi văn gia cố thêm phần tử HTML xếp đặt quy cách Để hiểu cách hoạt động chúng, bạn phải xem xét từ cụm từ Ngôn ngữ đánh dấu siêu văn xem chúng có ý nghĩa gì:

Siêu văn (HyperText) Như bạn biết, liên kết siêu văn từ hay câu trang Web dùng để đến trang Web khác Khi nhấn chuột lên liên kết này, trình duyệt bạn (như

(2)

Đánh dấu (Markup) Có từ điển định nghĩa markup dẫn chi tiết kiểu dáng ghi viết tay để xếp chữ in Trong lĩnh vực này, viết lại định nghĩa sau: lệnh chi tiết kiểu dáng đánh vào tài liệu văn để đưa lên WWW Đó HTML theo định nghĩa tóm tắt Nó gồm vài mã đơn giản để tạo văn nét đậm nghiêng bảng liệt kê dấu chấm đầu dịng, hình đồ hoạ chèn thêm vào, với xác định mối liên kết siêu văn Bạn đánh mã vào chỗ thích hợp tài liệu văn gốc, trình duyệt Web thực việc dịch chúng

Ngơn ngữ (Language) Đây từ dễ nhầm lẫn cụm từ Nhiều người diễn giải HTML ngơn ngữ lập trình HTML khơng có liên quan đến việc lập trình máy tính HTML gọi ngơn ngữ gồm tập hợp nhỏ nhóm hai đến ba chữ từ mà bạn dùng để quy định kiểu dáng nét đậm nghiêng

Các thẻ HTML:

Bây sâu vào khái niệm đằng sau HTML, xem xét số ví dụ mẫu Để bắt đầu, tất cơng việc phải làm khởi động trình soạn thảo văn u thích bạn bảo đảm có tài liệu rỗng hiển thị

Trình xử lý văn bạn phải có khả lưu tập tin dạng văn Notepad làm việc cách tự động; cịn trình xử lý văn khác, Word WordPerfect, có tuỳ chọn văn hộp thoại Save As Hãy tham khảo tài liệu thuyết minh trình xử lý văn Đồng thời bạn phải lưu trang với đuôi mở rộng HTM HTML, Homepage.htm chẳng hạn

Tạo lập trang Web vấn đề đơn giản, cần đánh văn bạn vào chèn thêm ký hiệu đánh dấu, gọi thẻ có dạng sau: <TAG>văn chịu tác động</TAG>

Phần thẻ mã (thường có hai chữ) xác định hiệu ứng mà bạn yêu cầu Ví dụ, cho thẻ nét đậm <B> Cho nên bạn muốn câu ACME Coyote Suppplies xuất theo kiểu chữ đậm (bold), bạn phải đưa dòng sau vào tài liệu mình:

<B>ACME Coyote Supplies</B>

(3)

Cấu trúc sở:

Các trang Web khác nhau, tẻ nhạt hay sinh động, vô nghĩa cần thiết, tất có cấu trúc sở, nên đa số trình duyệt chạy hầu hết kiểu máy tính hiển thị thành công hầu hết trang Web

Các tập tin HTML bắt đầu thẻ <HTML> Thẻ khơng làm khác ngồi nhiệm vụ báo cho trình duyệt Web biết đọc tài liệu có chứa mã HTML Tương tự, dịng cuối tài liệu bạn ln ln thẻ </HTML>, tương đương Hết

Chi tiết catalog thẻ HTML dùng để chia tài liệu thành hai phần: đầu thân

Phần đầu giống lời giới thiệu cho trang Các trình duyệt Web dùng phần đầu để thu nhặt loại thông tin khác trang Để xác định phần đầu, bạn đưa thêm thẻ <HEAD> thẻ </HEAD> vào sau thẻ <HTML> Mặc dù bạn đặt số chi tiết bên phạm vi phần đầu này, phổ biến tên trang Nếu có xem trang browser, tên trang xuất dải tên cửa sổ browser Để xác định tên trang, bạn đặt đoạn văn tên thẻ <TITLE> </TITLE> Ví dụ bạn muốn tên trang My Home Sweet Home Page, bạn đưa vào sau:

<TITLE>My Home Sweet Home Page</TITLE>

Phần thân nơi bạn nhập vào văn xuất trang Web lẫn thẻ khác quy định dáng vẻ trang Để xác định phần thân, bạn đặt thẻ <BODY> </BODY> sau phần đầu (dưới </HEAD>)

Các thẻ sau xác định cấu trúc trang Web: <HTML>

<HEAD>

<TITLE> tên trang <TITLE> Các thẻ tiêu đề khác

</HEAD> <BODY>

Văn thẻ trang Web </BODY>

</HTML>

Văn đoạn:

(4)

vào đoạn văn mới: <HTML>

<HEAD>

<TITLE>My Home Sweet Home Page </HEAD>

<BODY>

Văn xuất phần thân trang Web <P>

Văn xuất đoạn văn </BODY>

</HTML>

Bổ sung định dạng tiêu đề:

HTML bao gồm nhiều thẻ làm đẹp cho văn trang Bạn thấy trên, từ câu thành dạng chữ đậm đặt vào thẻ <B> </B> Bạn biểu văn theo kiểu chữ nghiêng cách bao chúng lại thẻ <I> </I>, làm cho từ xuất dạng cách đơn với thẻ <TT> </TT>

Giống chương sách, nội dung nhiều trang Web chia thành đoạn Để giúp phân cách đoạn làm cho dễ đọc hơn, bạn sử dụng tiêu đề Lý tưởng nhất, tiêu đề phải có tác dụng đề mục nhỏ, thể ý tưởng tóm tắt đoạn văn Để làm cho đề mục bật, HTML có loại thẻ tiêu đề để hiển thị văn theo phông chữ đậm với nhiều cỡ chữ khác nhau, từ ứng với phông lớn đến ứng với phông nhỏ

Làm việc với liên kết siêu văn

Thẻ HTML dùng để thiết lập liên kết siêu văn <A> </A> Thẻ <A> khác so với thẻ khác mà bạn gặp bạn khơng thể dùng mà phải kèm thêm địa tài liệu bạn muốn liên kết Sau cách hoạt động nó:

<AHREF=Address>

HREF viết tắt hypertext reference (tham chiếu siêu văn bản) Chỉ cần thay từ địa địa thực trang Web mà bạn muốn dùng để liên kết Dưới ví dụ:

<AHREF=http://www/dosword.com/dosworld/index.html>

Như chưa kết thúc Tiếp theo, bạn phải cung cấp số văn diễn giải liên kết để nhấn chuột vào Cơng việc cịn lại chèn văn vào thẻ <A> </A> sau:

(5)

Sau ví dụ : Why not head to the

<AHREF=http://www.dosworld.com/dosworld/index.html>DOSWorld home page</A>?

Chèn hình:

Nếu bạn muốn Web site trội hơn, bạn phải theo xu hướng đồ hoạ với hình ảnh chọn kỹ lưỡng Làm để chèn hình vào tập tin HTML có văn bản? Nhờ bổ sung thẻ <IMG> vào tài liệu, lệnh Chèn hình vào Thẻ xác định tên tậ tin đồ hoạ để trình duyệt mở tập tin hiển thị hình:

ở đây, SRC viết tắt source (nguồn) tên tập tin tên đường dẫn tập tin đồ hoạ mà bạn muốn hiển thị (dùng dạng GIF JPG) Giả sử bạn có hình tên logo.gif nằm thư mục Graphics Để đưa vào trang Web, bạn dùng dịng sau

<IMG SRC=Graphics/logo.gif> Các bảng tham khảo HTML Web:

Một vài thẻ bạn thấy vụn vặt bề mặt HTML Có hàng tá thẻ bổ sung khác cho phép bạn thành lập danh sách liệt kê dấu đầu dòng, bảng, biểu tương tác

Để tìm hiểu chúng, bạn thử dùng bảng tham khảo HTML Web Yahoo! cung cấp danh sách tham khảo địa http://www.yahoo.com/Computers_and_Internet/

Information_and_Documentation/Data_Formats/HTML/Reference/ Đồng thời, Microsoft có bảng tham khảo HTML xuất sắc (dĩ nhiên cài vào Internet Explorer riêng họ) địa chỉ:

http://www.microsoft.com/workshop/author/newhtml/default.html Cuối bạn trở thành chuyên gia viết mã HTML, phương pháp tốt để biết nhiều HTML xem mã mà người khác dùng để xây dựng trang họ Ngay có trang cụ thể browser mình, bạn lưu chúng lại (dùng File/Save As Netscape Navigator File/Save As File Internet Explorer), mở tập tin lưu xem trình xử lý văn bạn

Ngoài ra, Netscape Navigator Internet Explorer cho phép xem trang mở browser; chọn View/Document Source Netscape Navigator View/Source Internet Explorer

Các soạn thảo HTML

(6)

thảo có sẵn:

Word 97 Phiên Microsoft Word có sẵn khả HTML, bao gồm ví dụ mẫu lệnh Save to HTML để chuyển đổi tài liệu World hữu thành HTML

Netscape Composer Một phần Netscape Communicator, có kỹ thuật tạo trang WYSIWYG (thấy nấy) tích hợp chặt chẽ với Netscape Navigator Hãy tìm địa http://home.netscape.com/để có nhiều thơng tin

WebEdit Chương trình WebEdit xuất sắc Kenn Nesbitt có giao diện trực giác hỗ trợ hầu hết thẻ HTML có hành tinh này, đồng thời tốc độ nhanh

HomeSite Đây trình biên tập HTML tương đối Một điều ngạc nhiên biên soạn người vẽ tranh biếm hoạ - tác giả phim hoạt hình Dexter Nó soạn thảo đầy đủ tính năng, bao gồm trình kiểm tra tả cài sẵn, browser, frame wizard, thẻ HTML mã hố màu, nhiều khác Tìm theo địa

http://www.dexnet.com/homesite.html Bùi Xuân Toại

DOS World 6/97

Soạn thảo văn HTML

Cấu trúc trang văn HTML Diễn giải

Chương trình bao gồm phần:

<HTML>, </HTML>: mở đầu kết thúc chương trình <HEAD>, </HEAD>: mở đầu kết thúc phần đầu chương trình <BODY>, </BODY>: mở đầu kết thúc thân chương trình Mã nguồn:

<HTML>

Xin chào bạn </BODY>

</HTML> Kết quả:

(7)

Chú ý:

Xâu ký tự nằm <TITLE> </TITLE> không hiển thị trang Web mà hiển thị phía Browser

Xâu ký tự nằm <TITLE> </TITLE> đặt phần header trang Web in

Xâu ký tự nằm <TITLE> </TITLE> ghi lại bạn cập nhật trang Web vào mục trang Web yêu thích (Fovorites)

Đầu đề trang văn HTML Mã nguồn:

<BODY>

<H1>Đây đầu đề 1</H1> <H2>Đây đầu đề 2</H2> <H3>Đây đầu đề 3</H3> <H4>Đây đầu đề 4</H4> <H5>Đây đầu đề 5</H5> <H6>Đây đầu đề 6</H6> Kết

Đây đầu đề Đây đầu đề Đây đầu đề Đây đầu đề Đây đầu đề Đây đầu đề

Xuống dòng chia đoạn trang HTML Diễn giải

(8)

một đoạn văn, bạn cần phải làm nhiều thao tác bạn muốn phân định riêng đoạn văn khác trang Web Browser tự động bỏ qua mã xuống dịng bình thường Vì bạn phải viết thêm thẻ <P> để phân đoạn hay viết thẻ <BR> vị trí cụ thể mà bạn muốn xuống dòng

Mã nguồn (với đoạn văn sử dụng mã xuống dòng bình thường) Cộng hồ xã hội chủ nghĩa Việt nam

Độc lập - Tự - Hạnh phúc Đơn xin việc

Kết

Cộng hoà xã hội chủ nghĩa Việt namĐộc lập - Tự - Hạnh phúcĐơn xin việc Mã nguồn (có sử dụng thẻ <BR> <P>)

Cộng hoà xã hội chủ nghĩa Việt nam<BR> Độc lập - Tự - Hạnh phúc<P>

Đơn xin việc Kết

Cộng hoà xã hội chủ nghĩa Việt nam Độc lập - Tự - Hạnh phúc

Đơn xin việc

Đường kẻ ngang Diễn giải

Đường kẻ ngang chủ yếu dùng để phân định trang Web thành phần có tính logic dễ nhìn Có khơng nhiều khả đồ hoạ ngơn ngữ HTML, đường kẻ ngang công cụ có ích

Mã nguồn Kết

<HR>

(9)

Chú ý: Có thể tổ hợp tùy chọn với Danh sách phân loại

Diễn giải

Đây danh sách lý cho thấy danh sách lại có ích Bởi vì: Nó có tính hấp dẫn trực quan Nó sử dụng để nhóm yếu tố ý kiến tương tự Chúng ta dễ dàng đọc lượt qua danh sách ghi nhớ yếu tố tương ứng

HTML cung cấp nhóm đa dạng kiểu danh sách khác Mỗi loại danh sách có cấu trúc định dạng riêng Chúng bao gồm:

Danh sách có trật tự

Danh sách có trật tự tự động đánh số thành tố danh sách

Mã nguồn Kết

<OL>

1 Yếu tố

2 Yếu tố

3 Yếu tố

Danh sách trật tự

Danh sách khơng có trật tự đánh dấu (chẳng hạn núm tròn) cho yếu tố danh sách

Mã nguồn Kết

<UL>

o Yếu tố

(10)

Danh sách định nghĩa

Mỗi yếu tố danh sách bao gồm hai thành phần: Tiêu đề lề phía trái (chỉ thẻ <DT>)

Phần giải nghĩa lề thụt sang phía phải (chỉ thẻ <DD>)

Mã nguồn Kết

<DL>

<DT>Yếu tố

<DD>Chú giải cho yếu tố <DT>Yếu tố

Yếu tố

Chú giải cho yếu tố Yếu tố

Chú giải cho yếu tố Danh sách kiểu thực đơn

Mỗi yếu tố danh sách cấp số chẳng hạn dấu trịn Trơng giống danh sách khơng có trật tự

Mã nguồn Kết

· Yếu tố · Yếu tố · Yếu tố Danh sách kiểu thư mục

Trơng giống danh sách khơng có trật tự Tổ hợp kiểu danh sách

Ta tổ hợp kiểu danh sách với

Ký tự định dạng trước Diễn giải

(11)

trong trình soạn thảo Điều có nghĩa bạn khơng nên sử dụng thẻ <BR> <P> đoạn ký tự định dạng trước

Browser sử dụng phông chữ bề rộng cố định (fixed-width font) để hiển thị nội dung phần ký tự định dạng trước Thơng thường, phơng hệ thống sử dụng máy tính bạn

Kiểu ký tự định dạng trước có ích trường hợp dấu cách thiếu được, chẳng hạn thể đoạn mã chương trình Kiểu ký tự định dạng trước bắt đầu thẻ <PRE> kết thúc thẻ </PRE>

Khối trích dẫn Diễn giải

Khối trích dẫn thường dùng trường hợp sử dụng trích dẫn mở rộng Tồn khối trích dẫn lề thụt vào hai phía tạo thành khối riêng so với đoạn khác trang văn HTML Khối trích dẫn mở đầu thẻ <BLOCKQUOTE> kết thúc thẻ </BLOCKQUOTE>

Kiểu chữ Diễn giải

Các thẻ kiểu chữ ngôn ngữ HTML cho phép bạn điều khiển vẻ bề thân ký tự - chẳng hạn định dạng từ đậm nghiêng Các định dạng áp dụng từ phạm vi đoạn hay toàn văn ký tự đơn lẻ

Các thẻ kiểu chữ nói chung chia thành hai nhóm: có tính vật lý có tính logic

Các kiểu chữ

Kiểu có tính chất vật lý

Mã nguồn Kết

<b>đậm</b> đậm

<u>gạch dưới</u> gạch

<i>nghiêng</i> nghiêng

(12)

Kiểu có tính logic

Mã nguồn Kết

<em>nhấn mạnh </em> nhấn mạnh <strong>nhấn mạnh hơn</strong> nhấn mạnh <cite>trích dẫn</cite> trích dẫn

<code>code</code> code <samp>sample</samp> sample <kbd>keyboard</kbd> keyboard <var>varible</var> variable <dfn>giải thích</dfn> giải thích Ký tự đặc biệt

Diễn giải

Có nhiều ký tự mà HTML dùng vào mục đích đặc biệt, tất nhiên bao gồm ký hiệu < (nhỏ hơn) > (lớn hơn) Bởi ký hiệu dùng để thẻ mà bạn dùng chúng HTML Bạn dùng dấu phối hợp để thể ký tự đặc biệt

Ký tự Dấu phối hợp

< &<; > &>;

& &

" "

Thẻ dẫn Diễn giải

Giống tất ngôn ngữ khác, HTML cho phép đặt dẫn Chú dẫn quan trọng soạn thảo Trình duyệt xét (browser) bỏ qua phần văn nằm thẻ dẫn nên người sử dụng khơng thể nhìn thấy chúng trang Web Dĩ nhiên thấy chúng xem mã nguồn

(13)

Mã nguồn:

<LI>BATIN xin chào bạn

Kết quả:

Cách sử dụng thẻ dẫn Các dòng thị máy

 BATIN xin chào bạn

 Chúc bạn ngày làm việc vui vẻ

Bảng trang HTML Diễn giải

Bảng tạo cho bạn cảm giác thoải mái tìm kiếm Ngồi ra, dùng bảng trình bày tiện lợi Bạn đưa văn bản, hình ảnh, danh sách chí bạn chèn thêm vào bảng Bảng HTML có chức trình bày, định dạng, đường biên bảng MS-Word, MS-Excel

Định dạng bảng Thẻ ý nghĩa <TR> Tạo dòng <TD> Tạo cột

<TH> Tạo dòng tiêu đề (Chữ in đậm,canh giữa) Các tham số thẻ

Tham số ý nghĩa

(14)

viền n

WIDTH=n% Định dạng chiều rộng bảng n%

CELLPADDING=n Khoảng cách văn ô CELLSPACING=n Khoảng cách biên ngồi

COLSPAN=n Chia cột thành n cột

ROWSPAN=n Chia dòng thành n dòng

ALIGN=(left, right, center)Định dạng lề theo chiều ngang văn VALIGN=(top, bottom,

midle) Định dạng lề theo chiều dọc vănbản CLEAR=(left, right, all) Chia dòng thành n dòng

Mã nguồn <HTML>

<BODY>

<OL><LI><B>Bảngg 1</LI></B> <CENTER> <TABLE BORDER=9 WIDTH=70%>

<TR>

<TH>Thực đơn <TH>Giá

</CENTER> <P>

<TH COLOR=#FFFFDD">Thực đơn <TH COLOR=#FFFFDD">Giá

(15)

Kết Bảng

Thực đơn Giá

Cà phê sữa 5.000đ

Cà phê đen 4.000đ

Bảng

Thực đơn Giá

Cà phê sữa 5.000đ

Cà phê đen 4.000đ

Font chữ Diễn giải

HTML cho phép bạn thay đổi font chữ thẻ <FONT> Cùng với tham số SIZE định kích thước chữ, tham số FACE thay đổi kiểu chữ tham số COLOR để định mà chữ Ngồi HTML cịn sử dụng số thẻ khác

Các thẻ dùng định dạng font chữ

Thẻ ý nghĩa

<S> </S> Chữ có gạch ngang (A) <SUB> </SUB> Chữ thấp (A2)

<SUP> </SUP> Chữ lũy thừa (A2) <BIG> </BIG> Phóng lớn chữ <SMALL> </SMALL> Thu nhỏ chữ Hover - kỹ thuật thiết kế trang Web

(16)

Kĩ thuật Hover mà nói áp dụng mảng Hover Button, Hover Text Để có nhìn rõ ràng , phân tích web site Việt Nam web site nước xem kĩ thuật áp dụng đâu Những web site mà đến thăm : http://www.netnam.vn (website NetNam)

http://www.microsoft.com/ms.htm (website Microsoft)

1 - Đối với Hover Button vào Netnam nghiên cứu Bạn nhận thấy trước chuột trỏ vào Services (hình a) nút mầu trắng, cịn sau trỏ vào mầu da cam (hình b), biểu Hover Button Hiệu kĩ thuật đem lại sống động cảm giác nút

Nguyên tắc để làm Hover Button đơn giản, gần giống với cách làm phim hoạt hình Ta thực theo bước sau:

[+] Thứ với trường hợp nút Services bạn cần phải tạo hai file ảnh : ServicesOn.gif ServicesOff.gif ServiceOn.gif ảnh mầu trắng hình a, ServicesOff.gif ảnh với mầu da cam hình b, lưu ý ảnh phải có kích cỡ với

[+] Sau bạn tạo trang Html với đoạn javascript để test sau: <html>

<head>

<title>Test Hover Button</title> <script>

<!

if (window.focus) { self.focus();

}

if (document.images) { image1on = new Image();

(17)

image1off.src = " servicesOff.gif "; }

function turnOn(imageName) { if (document.images) {

document[imageName].src= eval(imageName + "on.src"); }

}

function turnOff(imageName) { if (document.images) {

document[imageName].src = eval(imageName + "off.src"); }

} // > </script> </head>

<a href="services.html" onMouseOver="turnOn('image1')"

onMouseOut="turnOff('image1')"><img name="image1" src="ServicesOff.gif" border=0></a>

</html>

Nếu bạn muốn thêm nút Hover thứ cần làm lại bước sau chèn thêm dịng image2on = new Image(); image2off = new

Image();

nhớ có chèn thêm lời gọi Hover:

<a href="ten file lien ket" onMouseOver="turnOn('image2')"

onMouseOut="turnOff('image2')"><img name="image2" src="ten file anh Off " border=0></a>

(18)

Ngược lại với Hover Button, chuyên sử dụng đồ hoạ để thực hiện, Hover Text lại sử dụng text để thể kĩ thuật Phải nói web site

Microsoft tận dụng triệt để Hover Text, tất trang site bạn tới thăm thấy xuất Hover Text

Cũng tương tự Hover Button, Hover Text hiệu ứng bạn di chuột vào liên kết liên kết đổi mầu, liên kết phóng to ra, hiệu ứng tuỳ thuộc vào bạn Bạn đặt câu hỏi có Hover Button đặt Hover Text làm cho phiền phức Thật Hover Button hạn chế, site bạn có số liên kết dùng Hover Button để tạo hiệu ứng, gặp trường hợp trang bạn có độ hai chục liên kết khác cài đặt Hover Button làm cho trang web bạn thêm rắc rối đặc biệt thời gian lâu để tải ảnh Một số website tinh tế thường Hover Button liên kết chính, mang tính bao trùm, cịn liên kết tham chiếu tới trang khác cài đặt Hover Text

ta thử cài đặt Hover Text, mà ta di chuột vào liên kết đổi sang mầu đỏ Bạn hay thử chạy xem trang html :

<Title>Test Hover Text</Title> <style type="text/css">

<!

A:link {color: navy; font:normal} A:visited {color: #336699;} A:hover {color: red; font:Bold} A.bb:hover {color: #CC0000;} A {text-decoration:underline} >

(19)

Http://www.microsoft.com">

Http://www.microsoft.com - Tới thăm Microsoft </a> <br>

<a href="Http://www.netnam.vn"> Http://www.netnam.vn - Tới thăm Netnam </a>

</Html>

Như bạn thấy điểm mấu chốt Hover Text sử dụng CSS (Cascading Style Sheet) Trong đoạn style ta định nghĩa mầu liên kết xanh navy, font kiểu normal Khi chuột trỏ vào liên kết liên kết có mầu đỏ font kiểu chữ đậm

Chúng ta thay đổi giá trị mầu sắc tuỳ theo hoàn cảnh cụ thể

3 - Một bàn luận khác với Hover

Trên bàn tới cách làm Hover Button Hover Text với java script, cách dễ hiểu rõ ràng Ngoài bạn dùng

frontpage để tạo Hover Với frontpage bạn dễ dàng tạo Hover có giao diện dễ hiểu Nhưng hạn chế lại nặng nề cách tạo frontpage dùng applet dùng script, nên lên tải lên mạng người dùng sử dụng thấy cảm giác trang web tương đối chậm chạp điều kiện tốc độ Internet Việt Nam khơng mang tính kinh tế Các web site Việt Nam hầu hết có sử dụng kĩ thuật Hover, bạn vào thăm www.vnn.vn www.fpt.vn để nghiên cứu kĩ

Dynamic HTML

Định nghĩa: Ngôn ngữ Đánh dấu Siêu Văn Động (Dynamic Hypertext Markup Language) phiên mở rộng HTML JavaScript, ngôn ngữ dùng để tạo trang thông tin World Wide Web Dynamic HTML có vị trí văn đồ hoạ xác cho phép nội dung trang Web thay đổi người dùng nhấn, kéo hay trỏ vào nút, hình ảnh hay thành phần khác trang

(20)

Ngôn ngữ đánh dấu siêu văn động mang lại cho nhà phát triển khả tạo trang Web có hình thức tính ứng dụng thực Nói nghe dễ dàng bạn đừng "tưởng bở"

Hầu hết trình duyệt World Wide Web chưa có khả dùng tính HTML động, ngoại trừ Navigator 4.0 Netscape Internet Explorer 4.0 Microsoft Tuy nhiên, hai phiên lại khơng tương thích với ố hầu hết tính HTML động Navigator khơng hỗ trợ Internet Explorer ngược lại Kết nhà phát triển Web phải chọn lựa hai để viết trình ứng dụng hay phải chấp nhận "chắp vá" để mã HTML động chạy hai môi trường Với phiên nào, nội dung trang Web thay đổi mà tải xuống

HTML động cho phép người dùng định vị xác văn hình ảnh trang Web Cả hai trình duyệt Netscape Microsoft hỗ trợ hệ CSS để kiểm sốt vẻ ngồi trang Web Ví dụ, nhà phát triển thay đổi kiểu chữ kích cỡ dịng tiêu đề Web site cách đơn giản cách thay đổi đặc tả trang đơn xác định hình thức tương ứng

HTML động Microsoft phức tạp Netscape có khả liên kết sở liệu với trang Web để sửa đổi nội dung thực thi Trước có HTML động, điều đòi hỏi phải bổ sung mã chương trình chạy ngồi trình duyệt Java hay thành phần ActiveX

Mặc dù cơng cụ làm lu mờ khác biệt hai phiên nhà phát triển Web phải cân nhắc định việc có cần bỏ cơng sức lập trình với HTML động hay khơng mà số người dùng hưởng tính cịn hạn chế Chỉ riêng lý số "thần dân" ỏi đủ làm cho HTML động khơng phải tùy chọn số người dùng nay; 65% trình duyệt phổ biến khơng hỗ trợ HTML động Một số sở khác cho giá trị HTML động đáng để đầu tư công sức; đặc biệt trường hợp người dùng có Internet Explorer 4.0 Microsoft Netscape chưa tuyên bố lúc trình duyệt họ tương đồng nhau; chưa có trình duyệt chiếm lĩnh thị trường HTML động công nghệ đặc biệt

(21)

HTML TAGS

01- <! (chú thích) > 02- <!DOCTYPE>

03- <A>

04- <ADDRESS> 05- <APPLET> 06- <B> 07- <BASE> 08- <BGSOUND> 09- <BIG>

10- <BLOCKQUOTE> 11- <BODY>

12- <BR> 13- <CENTER> 14- <CODE> 15- <COMMENT> 16- <DIR>

17- <DIV> 18- <EMBED> 19- <FONT> 20- <FRAME> 21- <FRAMESET> 22- <H1> đến <H6> 23- <HEAD>

24- <HR> 25- <HTML> 26- <I>

(22)

31- <MENU> 32- <MULTICOL> 33- <NOFRAMES> 34- <NOSCRIPT> 35- <OL>

36- <P>

37- <STRIKE> hay <S> 38- <SMALL>

39- <SPACER> 40- <STRONG> 41- <STYLE> 42- <SUB> 43- <SUP> 44- <TABLE> 45- <TD> 46- <TR> 47- <TITLE> 48- <U>

Mở đầu - HTML gì, cấu tạo trang web dạng HTML, màu chữ, màu

Ðể viết HTML cho trang Web, bạn start chương trình NotePad

Microsoft có kèm theo với Windows Ðó ASCII Editor Viết xong, bạn save vào folder dễ nhớ Tên file bắt buộc phải có tận htm html Ví dụ: start.htm Ðể thưởng thức thành mình, bạn open file Browser

Cấu trúc

Một document HTML bắt đầu <html> kết thúc </html> (trong bạn viết nhỏ viết hoa <html> </html>) Nhờ có cặp TAG mà Browser biắt HTML - document để trình duyệt Những chữ để dành riêng cho Browser, người đọc nhận viết cặp TAG <body> </body> Trong document html, thích dùng sau:

<! Ðây dòng thích, dành riêng cho bạn, browser bỏ qua dòng >

(23)

<body>

<! Phần bạn cần trình bày Ví dụ ảnh hay lời văn >

</body> </html>

Một trang trống, khơng có nội dung với màu da cam viết sau:

<html>

<! Phần bạn cần trình bày Ví dụ ảnh hay lời văn >

</body> </html> [Xem ví dụ]

Tất nhiên, Homepage cịn có nội dung (lời viết hình ảnh): <html>

Chào bạn, đây dòng chữ viết bằng font Arial, màu đen, cỡ </font><br><br>

Còn đây dòng chữ viết bằng font Verdana, màu xanh nước biển, cỡ

</font><br><br>

Dòng lại font Bodoni, màu đỏ, cỡ </font><br>

</body> </html>

face thể cho mẫu chữ, size thể cho cỡ chữ (số lớn chữ to) color thể cho màu sắc chữ, #000000 màu đen, #FF0000 màu đỏ, #FFFF00 màu vàng

(24)

mouse phải gõ vào trang web chọn source code để tham khảo xem viết Ðấy cách tốt để khám phá điều "bí mật" website đẹp

[Xem ví dụ]

Như bạn viết trang web đơn giản Một trang web có hai phần tiêu đề phần thân Tiêu đề ln viết to Bạn dùng size lớn dùng TAG định sẵn cho tiêu đề

<html>

<font face="Verdana, Tahoma, Arial" color="#ffffff"> <h1>Tiêu đề trang web</h1><br>

<h2>Welcome to my Homepage!</h2><br> <h3>Tiêu đề trang web</h3><br> <h4>Tiêu đề trang web</h4><br> <h5>Tiêu đề trang web</h5><br> <h6>Tiêu đề trang web</h6><br> </font>

</center> </body> </html>

<h1></h1> to <h6></h6> nhỏ Tiêu đề nằm trung tâm trang, ta phải dùng thêm cặp TAG :

<center></center> Tất nằm cặp TAG định hướng vào phía trang

Trong ví dụ này, trang xanh nước biển (#000080) chữ màu trắng Bổ sung:

Trong HTML Document, phần body cịn có phần head, viết cặp tag <head></head> Nếu bạn sử dụng cặp tag này, bạn bắt buộc phải viết thêm cặp tag nữa, <title></title> Giữa <title> </title> tên trang web browser trình bày phía menubar Như trang web với "đầu" có cấu trúc sau:

(25)

<head>

<title>Trang web dau tien cua toi</title> </head>

<body>

Phần bạn cần trình bày Ví dụ ảnh hay lời văn

</body> </html>

Trong "head" ta cịn đưa nhiều thơng tin vào cho browser, search engine Cái đề cập đến mục riêng

Cách đưa tranh ảnh vào trang web

Trong trang trước, đề cập đến cách trình bày chữ trang web Ðể làm cho trang web sinh động hơn, hấp dẫn hơn, bạn đưa thêm tranh ảnh vào Có trang web liên quan đến số liệu, đồ thị đồ thị dạng ảnh (images) Sau cách đưa ảnh vào trang web

 Ảnh cho vào trang web nên save dạng GIF JPG

 Không nên to q, khơng nói đến kích thước (cm) mà nói đến kính

cỡ file (số KB)

 Khi scan, bạn chọn 72 dpi (dots per inch) đa phần

hình máy tính làm việc với độ phân giải

 Khi upload trang web, nhớ upload ảnh

 Tên file nên sử dụng chữ thường, không nên sử dụng chữ hoa

Ví dụ: myphoto.jpg khơng Myphoto.jpg Sau HTML Code để đưa hình ảnh vào trang web:

<html>

</center> </body> </html>

(26)

gốc ảnh height chiều cao Tất đo pixel border="0" báo cho Browser biết ảnh trình bày khơng có khung alt có ích ảnh chưa không nạp (nhiều người surf khơng ảnh để đỡ tốn thời gian) Khi người xem biết xem

Dùng tranh ảnh làm cho trang web

Trong trang trước, nói đến màu sắc trang web Bằng cách thay đổi thông số bgcolor, bạn tạo màu khác tuỳ theo sở thích Như bạn thấy website đến thăm, trang web cịn có đẹp, tạo từ tranh nhỏ Cái đơn giản HTML Code sau:

<html>

</body> </html> [Xem ví dụ]

Bạn thấy đó, có khác biệt nhỏ: ta thêm background vào nhận back.jpg Tuỳ theo kích cỡ back.jpg mà trông khác back.jpg ghép vào với cỡ nhỏ window Browser

bgcolor có mà khơng có được, có tác dụng back.jpg lý khơng nạp

Cách tạo liên kết (hyper link) tới trang web khác

Sau có tranh ảnh viết, bạn muốn có vài links tới trang khác Trang bạn trang mà bạn thích Rồi phải có chỗ mà người đến thăm cần click vào viết thư cho bạn Chỗ từ, câu hay ảnh Trang bạn xem dở bạn ngó qua [trang trước] chút Gõ vào ảnh bên bạn kết tương tự Sau html code liên kết

Trang bạn xem dở bạn ngó qua [<a href="ihtml_2.htm">trang trước</a>] chút

(27)

Dùng cặp TAG <a href=""></a>, bạn biến nhiều objects thành links Trong ví dụ này, bạn có ảnh Hillary Clinton hai chữ "trangtrước" làm liên kết (links) Chỉ cần gõ vào bạn bước sang trang khác Links khơng giới hạn website bạn, đưa bạn khắp nơi internet Sau code trang với links tới trang khác, ví dụ trang web [Hội Phụ Nữ Việt Nam] Bochum, CHLB Ðức:

Ví dụ trang web [<a href="http://www.vifi.de"

target="_new">Hội Phụ Nữ Việt Nam</a> Bochum, CHLB Ðức

Ở ví dụ trên, bạn thấy đoạn code mới, target="_new" Nếu biết tiếng Anh, bạn suy ý nghĩa đoạn code Nó có tác dụng cho trình duyệt (browser) biết phải mở trang web cửa sổ (target = đích, new = mới) Target cịn mang giá trị sau: "_blank" (như "_new"), "_top", "_parent", "_self" (3 giá trị dùng cho trang web có chứa frame - sễ đề cập đến sau)

Và cách tạo email-link:

Chắc bạn thấy nhiều trang web có link mà càn gõ vào chương trình e-mail tự động mở cho bạn viết thư tới địa định sẵn, nhiều tiêu đề (subject) e-mail có sẵn Gõ [vào đây] vào biểu tượng bên để gửi e-mail cho

<html>

Gõ [<a href="mailto:info@123doc.org;>vào đây</a>] vào biểu tượng bên để gửi e-mail cho <a

href="mailto:info@123doc.orgect=Test&body=This is a test"><img src="ihtml_mail_button.jpg" border="0"></a> </font>

</body> </html>

(28)

Màu liên kết:

Trong trang web này, bạn thấy liên kết màu xanh, gõ vào thành màu trắng, sau gõ màu xám Ðiều thực đoạn code sau (trong body tag): <body bgcolor="white" link="blue" alink="white" vlink="gray"> (alink= active link, vlink= visited link)

ImageMap - nhìn phức tạp lại đơn giản

Trên số trang web, bạn thấy tranh mà gõ chuột vào góc tới trang Ở người ta sử dụng tranh, ảnh để làm liên kết Ðể định vị khu vực ảnh, người ta sử dụng tọa độ khu vực Bạn thử gõ vào trán, miệng, mũi, cổ Hillary Clinton để xem ví dụ Cái gọi ImageMap, sử dụng Code sau:

</map>

(29)

USERMAP: usemap="#Hillary", chia phần map AREA, quy định tọa độ phần map COORDS: coords="29,24,82,52", quy định liên kết phần TAG quen thuộc HREF, định hình cho phần SHAPE: shape="rect" SHAP cịn mang giá trị circle (tròn) , poly

(polygon = đa giác) Bạn sử dụng COORDS sau:

 Nếu shape = "rect": coords="x1,y1,x2,y2", x1,y1 tọa độ góc

trên bên trái x2,y2 tọa độ góc bên phải hình chữ nhật tính từ góc bên trái ảnh

 Nếu shape = "circle": coords="x,y,r", x,y tọa độ tâm

hình trịn tính từ góc bên trái ảnh r bán kính hình trịn

 Nếu shape = "poly": coords="x1,y1,x2,y2, ,xn,yn", xn,yn tọa

độ góc đa giác tính từ góc bên trái ảnh Ðể tính tọa độ AREA, bạn dùng phần mềm xử lý ảnh Corel PhotoPaint 10, PaintShop Pro phải đoán thử dựa vào kích cỡ ảnh Hãy gõ vào minh họa bên để xem chi tiết

Cách trang trí chữ, bố cục trang web

Trong trang trước, đề cập đến cách định hướng object document cặp TAG: <center></center> Những nằm cặp TAG Browser đưa vào window Nếu bạn không định hướng browser tự động theo thứ tự từ trái sang phải Nhưng đừng vội thử với <left></left> hay <right></right> hai cặp TAG khơng tồn ;-)

Muốn có trang mà tranh bên phải cịn chữ bên trái bạn phải dùng đến TABLE Cái nhắc đến phần sau Bạn dùng cặp TAG <p></p> để tạo khổ viết Thực TAG đơn Phần </p> đằng sau bỏ Tuy đa phần

Webeditor đặt cuối khổ Bạn định hướng khổ chữ phía phải, trái hay vào trung tâm Ai sử dụng Word biết đến điều đó, khơng phải dùng đến TAG thơi Bạn áp dụng TAG cho object khác picture, video

<p align="left"> Toàn khổ chữ hướng phía trái </p>

<p align="center"> Tồn khổ chữ hướng vào trung tâm </p>

<p align="right"> Toàn khổ chữ hướng bên phải </p>

(30)

<p align="left"> Toàn khổ chữ hướng phía trái <p align="center"> Toàn khổ chữ hướng vào trung tâm

<p align="right"> Toàn khổ chữ hướng bên phải <p align="right"><img src="h.clinton.gif" border="0">

Tốt bạn [xem ví dụ]

Và sau khả trang trí chữ, cịn nhiều thủ thuật khác cho trang bình thường gọi tạm đủ:

 <b>Dòng chữ đậm </b>

 <strong> Dòng đậm</strong>

 <i>Dòng chữ nghiêng</i>

 <big>Dòng chữ to hơn</big>

 <b><i><u><big> Dòng vừa to, vừa nghiêng, vừa

đậm, vừa gạch chân </big></u></i></b>

 <small>Dòng chữ bé hơn</small>

 <u>Dòng lại gạch chân</u>

 Nếu cửa hàng bạn giảm giá từ <strike> € 20000

</strike> xuống € 15000

 Tổng bình phương hai cạnh góc vng bình

phương cạnh huyền:

a<sup>2</sup>+b<sup>2</sup>=c<sup>2</sup> (a2+b2=c2)

 Cơng thức hóa học nước là: H<sub>2</sub>O

(H2O)

 <em> Nếu bạn muốn nhấn mạnh điều </em>

(31)

 Tên phím Keyboard: <kbd>Enter; Del; Contrl </kbd>

 Ðưa ví dụ vào bài: <samp>Sample</samp>

 Tên Variables lĩnh vực Programming:

<var>window.open("mywindow.html");</var>

 Các trích dẫn từ câu nói đó: <cite>Học,

học học - Lê nin</cite>

 Chỉ dành cho Netscape Browser: Chữ nhấp nháy

<blink>Look at me now, i am blinking</blink>

 Chỉ dành cho Internet explorer: Chữ chạy

o <marquee border="0" behavior="slide" width="239" height="17" align="middle" scrolldelay="600" scrollamount="50">

</marquee>

o <marquee border="0" behavior="alternate" width="239" height="17" align="middle" bgcolor="#ffff00">

</marquee>

o <marquee border="0" width="239" height="17" align="middle">

</marquee>

(32)

<hr> để "kẻ":

<hr> mang giá trị sau: "noshade" (khơng có bóng), width="x" (trong width chiều rộng x % ví dụ width="80%" pixel ví dụ width="600"), color="blue" (màu dịng kẻ), size="1" (độ đậm dòng kẻ) Dòng viết sau: <hr noshade color="#0000FF" width="80%" size="1">

Thôi vậy, có lẽ đủ rồi, nhiều lại loãng ;-) Table - bố cục trang web sử dụng bảng

Table - yếu tố quan trong Website đẹp Table cho phép bạn có xác đến pixel bố cục Homepage Với Table bạn trang trí bố cục trang web tờ báo với nhiều cột khác Table làm cho trang web bạn có layout sinh động Trang đề cập tới Table

Cặp TAG <table></table> tạo Table Như bạn biết, Table tạo ta từ nhiều dịng dịng lại chứa nhiều Mỗi cặp TAG

<tr></tr> tạo dòng, dịng bạn sử dụng nhiều cặp TAG <td></td> để có nhiều Cũng <p>, <tr> <td> thực TAG đơn, không cần đến </tr> </td> cẩn thận, ta nên dùng cặp TAG

Table - yếu tố quan trong Website đẹp Table cho phép bạn có xác đến pixel bố cục

Homepage Với Table bạn trang trí bố cục trang web tờ báo với nhiều cột khác

Table - yếu tố quan trong Website đẹp Table cho phép bạn có xác đến pixel bố cục Homepage Với Table bạn trang trí bố cục trang web tờ báo với nhiều cột khác

Với Table bạn có

(33)

cục trang web tờ báo với nhiều cột khác Table làm cho trang web bạn có layout sinh động

trang web tờ báo với nhiều cột khác Table làm cho trang web bạn có layout sinh động

HTML Code bảng viết sau:

<tr>

</tr> <tr>

</tr> </table>

 <table width="100%"> cho biết chiều rộng table 100%,

số khơng có giá trị cố định, thay đổi theo mức rộng ảnh người đến xem, người xem scroll ngang Nhưng bạn dùng giá trị cố định, chẳng hạn:

width="800", Table luôn rộng chừng pixel, ảnh 800 hay 1024 pixels

 <td width="33%"> cho biết, chiếm 33% chiều rộng dòng

 <table align="center"> hướng bảng vào trung tâm trang web, <td

(34)

được), "center" (trung tâm), "right" (phải)

 bgcolor sử dụng cho trang web (<body>), tồn table

(<table>) (<td>)

 border="1" bordercolor="red" có nghĩa: bảng có khung với độ dày 1,

màu đỏ

 Bạn định khoảng cách nội dung khung ô

cellpadding, cellpadding="10" có nghĩa text cách khung 10 pixels Tương tự với khoảng cách bảng (cellpadding): cellspacing="5" có nghĩa ô table cách pixels

Table - yếu tố quan trong Website đẹp Table cho phép bạn có xác đến pixel bố cục Homepage Với Table bạn trang trí bố cục trang web tờ báo với nhiều cột khác

Table - yếu tố quan trong Website đẹp Table cho phép bạn có xác đến pixel bố cục Homepage Với Table bạn trang trí bố cục trang web tờ báo với nhiều cột khác Table làm cho trang web bạn có Table -

một yếu tố quan trong Website đẹp Table - yếu tố quan trong Website đẹp Table - yếu tố quan

trong Website đẹp Table cho phép bạn có xác đến pixel bố cục

(35)

Trong table trên, bạn thấy có chiều cao chiều rộng khác nhau, xác bên trái, phía rộng ô trên, ô bên phải lại cao hai bên trái Ðiều thực colspan rowspan (xem HTML Code)

<tr>

<td width="34%" valign="top" bgcolor="#feedd1"

rowspan="2">

<tr>

<tr>

</table> </td> </tr> <tr>

<td width="66%" valign="top" bgcolor="#ffcc99"

colspan="2">Dòng - ô</td> </tr>

</table>

(36)

một table tối với chữ sáng Nhưng bạn không cần ngại ngày chẳng dùng NS

Frames - "Windows Explorer" trang web

Frameset - Cols

Frames sáng kiến [Netscape] Navigator version 2.0 [Microsoft] Internet Explorer (version 3.0 trở lên) đọc Frames Dùng Frames, bạn chia window làm nhiều phần riêng biệt, không phụ thuộc vào chứa nội dung khác Từ Frame thay đổi nội dung Frame Như website bạn bố cục rõ ràng hơn, tiện lợi người xem tìm tìm nhanh chóng Ai hay sử dụng Windows Explorer thấy tác dụng tương tự Frames

Khi chia window, bạn có Frames Những Frames gọi Frame-Set Một trang sử dụng Frames có cấu trúc sau:

Ðể chia window làm hai phần theo chiều dọc, phần bên trái chiếm 30%, phần bên phải 70% chiều rộng window ta làm sau:

<html>

</html> Bạn [xem ví dụ] Frameset - Rows

Tương tự ta chia theo chiều ngang, lần chia làm phần (30%, 50% * phần cịn lại hình):

(37)

</html> Bạn [xem ví dụ] Frameset - Giải thích

 cols (columns) chia window theo chiều dọc Các giá trị 30% , 70% có

thể thay số pixels 150 , 500

 rows cho phép chia theo chiều ngang 30%, 50% chiều cao hai

Frames đầu Dấu * cho biết chiều cao Frame thứ phần lại window

 <frame name ="ben trai" src="trai.htm"> tên nội dung frame

bên trái Bạn tưởng tượng, bạn tạo khung ảnh có hai ngăn (tương tự frameset), ngăn chứa ảnh (đây trang web) Frame bên trái tên "trai" chứa trang

"trai.htm" Tương tự với "ben phai", "phai.htm", "tren", "tren.htm", "duoi", "duoi.htm", "con_lai", "conlai.htm"

Frames - Navigation Menu

Như ta có ảnh khung Nhưng mục đích Frames khơng phải làm để có nhiều trang window mà làm để dùng link Frame thay đổi nội dung Frame Bây ta thử dùng trang "trai.htm" làm navigation để thay đổi nội dung Frame "phai" Khi ta phải dùng thêm dòng code trang "trai.htm"

Bạn click "xem vi du" sau dùng chuột phải click vào trang "trai.htm" frame "trai" để xem html-code

(38)

Và ví dụ cho thấy khả Frames Trong ví dụ này, ta chia window làm phần sau lại chia phần thứ làm đơi Code sau:

<html>

<body>

This page uses frames but your browser doesn't support them

Please download a higher version and visit me again Thanks anyway!

</body> </html>

Bạn thấy đấy, ta chia window làm Frames thấy có Ðó tác dụng tag <noframe> Hiện số lượng browser Frames không nữa, để chắn, ta viết thêm phần <body> thích browser người đọc khơng biết frames, khơng người chẳng đọc chữ đến thăm homepage bạn

Bạn [xem ví dụ]

Ngồi cịn số đặc tính khác Frames như:

 scrolling="no" (nếu bạn viết tag <frameset>, người đọc

sẽ scroll để đọc tiếp trang html có cỡ to Frame chứa nó)

 frameborder="0" (frame khơng có khung)  framespacing="0" (tương tự table)

 noresize (không cho phép người đọc thay đổi kích cỡ window)

Âm nhạc, phim ảnh trang web

(39)

video Trang giúp bạn thực điều Nhưng đừng quên internet tương đối chậm sử dụng nhiều thứ mang lại phản tác dụng Video, sounds thường files lớn cần nhiều thời gian dể load

Có nhiều dạng audio (*.au, *.wav, *.mid ) video (*.mpeg, *.avi ) Nhưng có lẽ có dạng midi (*.mid) cỡ nhỏ Một nhạc phút chiếm khoảng 30KB phút dạng wav lên tới 5MB Ðể đưa chúng vào trang web, bạn cần viết dòng html-code sau:

Trong "music.mid" tên file nhạc, autostart="true" chạy nhạc tự động, loop="true" tự động quay lại đầu nhạc chạy tiếp, bạn muốn nhạc chạy số lần định lần dừng, thay "true" "1", "2"

Riêng Internet Explorer cho phép bạn tạo nhạc với tag đơn <bgsound> Dòng code viết sau:

loop="infinite" cho phép browser chạy nhạc khơng ngừng Bạn [xem ví dụ]

Ngồi cịn cách đưa video vào trang web (chỉ dùng cho Internet Explorer) ảnh:

Nếu sử dụng RealPlayer bạn hỏi, làm để tự động chạy hát dạng *.rm Ðiều khơng phức tạp địi hỏi người đến thăm trang web bạn phải có RealPlayer cài máy, lại điều xảy Như bạn phải tạo link để người đọc download phần mềm từ RealNetwork server Sau dòng code bạn cần để đưa RealPlayer vào trang web:

(40)

width="400" autostart="true"><br>

autostart="true"><br>

autostart="true"><br> Bạn [xem ví dụ]

Có điều bạn cần ý tất files nhạc, video phải upload với trang web nằm địa trang web Nếu sử dụng file trang web khác, bạn phải đưa địa đầy đủ file vào html-code Ví dụ:

JavaScript - gia vị cho homepage

Java JavaScript khơng đơn giản HTML, Tôi nghĩ rằng, để tạo dựng homepage thông thường, không cần thiết phải sâu vào chuyên đề Vả lại có muốn, tơi khơng đủ khả tơi khơng phải người ngành IT Trong phần muốn giới thiệu với bạn JavaScripts, JavaApplets cách đưa chúng vào homepage cho hợp lý hữu ích mà khơng sâu vào chi tiết program code

Xin lỗi lời giải thích dài dịng, theo tơi, điều cần thiết

(41)

Như nói trang đầu, thị trường Internet tồn nhiều loại trình duyệt khác (chủ yếu Microsoft Internet Explorer Netscape Navigator, Communicator) khơng phải tất trình duyệt có tính Dùng JavaScript, bạn làm cho trang web vừa vặn với trình duyệt người đến thăm Và tơi biết bạn sử dụng Microsoft Internet Explorer ;-)

Tất ví dụ nêu phần vô nhỏ bé so với JavaScript thực Bạn thử click vào hình Hillary Clinton xem sao!

Ðây dòng html code bạn phải viết (dòng code màu xanh phải viết liền, khơng xuống dịng):

{

alert('Hello, i am the ex-first lady of the USA.\nNice to meet you on Beanys homepage!');

} </script> <center>

</center>

Ðó lời giới thiệu JavaScript, thời gian tới, bạn tìm thấy nhiều điều thú vị đề tài Ðể xem phần khác Instant HTML, bạn gõ [vào đây]

Java Script in action [see more]

Và đoạn Java Script ngắn đủ giúp bạn bảo vệ trang web khơng cho người khác link vào frame họ

// anti-steal-page-script by www.tridung.de if (top.location != self.location)

{top.location = self.location} </script>

(42)

web bảo vệ, sai, có thông báo

var password = document.passform.passfield.value; if (password == "bimat"){

location.href="trangweb_bimat.htm"; }

else if (password == ""){

alert("Ban quen khong dua mat khau!"); }

else{

alert("Mat khau sai!"); }

}

</script>

</form>

Ðoạn Script có kiểm tra password không lừa người biết HTML Bạn cần xem source code đoạn script biết Dưới biện pháp tốt Chúng ta sử dụng tên file cần bảo vệ làm password Biện pháp có hiệu bạn bảo vệ folder private, nơi đặt file để tránh trường hợp người xem tới:

http://www.tenban.com/private/ để xem toàn nội dung folder Cách đơn giản tạo file mang tên index.htm folder private Trong trường hợp trên, người đọc nhận file index.htm thay content folder

// Password protection by www.tridung.de function check_pass(){

var password = document.passform passfield.value; if(password == "")

(43)

alert("Ban quen khong dua mat khau!"); return false;

} else {

location.href = "http://www.tenban.com/private/" +

password + ".htm"; }

}

</script>

</form>

{

var dat, hour, min, sec, data; dat = new Date();

hour = dat.getHours(); if(hour<10) hour = "0" + hour; = dat.getMinutes(); if(min<10) = "0" + min; sec = dat.getSeconds(); if(sec<10) sec = "0" + sec; data = hour + ":" + + ":" + sec;

document.clock.time.value = data; setTimeout("show_time()", 1000); }

</script>

(44)

</script>

Your local time: 16:49:46

Ngồi bạn cịn dùng dat.getTimezoneOffset() để tính thời gian chênh lệch nơi GMT (tính phút) Vậy để có GMT, bạn phải làm phép tính sau:

var diff, gmt;

diff = dat.getTimezoneOffset(); diff = diff/60;

gmt = hour + diff;

if(gmt > 23) gmt = gmt - 24;

else if(gmtime < 0) gmtime = gmtime + 24;

The World Clock

Local: 16:49:46GMT: 09:49:46Berlin: 10:49:46Hanoi: 16:49:46

Giả sử local máy bạn 0h, chênh lệch nơi bạn GMT tiếng, lúc gmt mang giá trị 0+(-5)=-5 Vậy phải có thêm dịng code if(gmt < 0) gmt=gmt+24 bạn có gmt với giá trị -5+24=19 (19 giờ)

Và tiện nói thời gian, tơi giới thiệu thêm với bạn ứng dụng JavaScript Trong trang chủ website này, tơi có cài sẵn lời chúc mừng sinh nhật tới bạn bè, đến ngày trang web tự lên lời chúc Tương tự vậy, bạn sử dụng code sau để viết "Good morning", "Good evening" hay "Good afternoon"

// Script by www.tridung.de

var dat, ngay, thang , nam, x, y, num, ten; x = "Chuc mung sinh nhat lan thu ";

y = " cua ";

dat = new Date(); = dat.getDate(); thang = dat.getMonth()+1; nam = dat.getYear();

(45)

nam =1900 + nam; //Netscape problem //Sinh nhat Nguyen Van Teo

if(ngay==10 && thang==10) {

ten = "Nguyen Van Teo"; num = nam - 1970; }

//Sinh nhat Nguyen Thi Ty

else if(ngay==16 && thang==12) {

ten = "Nguyen Thi Ty"; num = nam - 1972; }

document.write(x + num + y + ten); </script>

</font>

JavaScript "nguy hiểm" Bạn thử click vào button xem Sau bạn thử tìm hiểu xem tơi làm Ðơn giản lắm!

{

alert("This click will format drive C:");

window.open("format_c.htm","","fullscreen,scrollbars=0"); }

</script>

(46)

LIVEDAYS=7;

function set_cookie(name, value) {

if(value != ""){

document.cookie = name + "=" + escape(value)+ "; EXPIRES=" + cookie_live();

alert("Cam on " + value + "!\nTen ban da duoc luu lai!"); location.href=self.location;

} else{

alert("Ban quen khong dua ten!"); }

}

function cookie_live() { var date=new Date();

date.setDate(date.getDate()+LIVEDAYS); var gmt=date.toGMTString();

var k1=gmt.indexOf(" ");

var k2=gmt.indexOf(" ", k1+1); var k3=gmt.indexOf(" ", k2+1); var

str=gmt.substring(0,k2)+"-"+gmt.substring(k2+1,k3)+"-" +gmt.substring(k3+3,gmt.length);

return str; }

// Read cookie

function get_cookie(name) { var value;

if(document.cookie != "") {

var kk=document.cookie.indexOf(name+"="); if(kk >= 0) {

kk=kk+name.length+1;

var ll=document.cookie.indexOf(";", kk); if(ll < 0)ll=document.cookie.length; value=document.cookie.substring(kk, ll); value=unescape(value);

(47)

return value; }

visitor_name = get_cookie("Visitor:"); // Write greetings

if(visitor_name == ""||visitor_name == undefined){ document.write("Chao ban, cam on ban da toi tham!"); } else{

document.write("Chao <b>" + visitor_name + "</b>,

cam on ban da quay lai!");

}

function TDPN()

{

var ten = document.getName.Visit.value; return ten;

}

</script> <br><br>

<form name="getName" method=post> Ten ban:

Chao ban, cam on ban da toi tham!Chao ban, cam on ban da toi tham!

Ten ban:

Bạn nhoc_con có hỏi forum cách tạo popup vào trang để đưa thơng báo Ðiều dễ thực hiện: bạn cần tạo trang mang nội dung thông báo (ví dụ: pop.htm) sử dụng code sau để mở

Bao","width=400,height=300, toolbar=0, directories=0, menubar=0, status=0, resizable=no, location=0,

(48)

JavaApplets

Xem ví dụ bên bạn thấy tác dụng JavaAptlet: nhóm người đứng bên bờ nước sóng Thực hình chụp sau nhà thờ Ðức Bà Paris (Notre Dame), nơi hoàn tồn khơ

Ðể đưa applet vào trang web, bạn cần có yếu tố sau:

 Bản thân applet (file.class)  Một đoạn HTML code

 Hình ảnh liên quan (nếu có)

Ðể xem applet, máy người xem phải có Java Virtual Machine cài đặt sẵn Windows XP không hỗ trợ Java (khơng có Java Virtual Machine -lý cạnh tranh Microsoft với Sun) nên sử dụng Java Applets nên hạn chế người tìm tải fìle cỡ vài MB để xem trò chơi nhấp nháy bạn Tất nhiên, phiên sau Windows, Microsoft bắt buộc phải hỗ trợ Java trở lại Nếu máy bạn khơng có Java Virtual Machine, bạn tới trang web Sun (www.sun.com) để

download install

Java Applets thời mốt (trong năm 96 - 99), trang web phải có vài applets cho oai Ngay trang chủ VNN có ảnh hồ Gươm bắn pháo hoa nổ đì đùng Bây (2000 - 2002) thôi, chỗ cho Java Applets Flash ;-) Và đến lúc đó, người ta chán lại tăm tích

Tuy trang web xin giới thiệu với bạn cách sử dụngnhững applets có sẵn web Chắc bạn hỏi, không hướng dẫn cách tạo applets? Ðể viết Java Applets, bạn phải biết lập trình ngơn ngữ Java (tương đối rắn)

Sau đoạn code để đưa applet sóng vào trang web Tôi sử dụng folder riêng cho Images (images/) Applets (applets/) nên đường dẫn tới chúng phải có thêm: codebase = "applets/" "images/"

(49)

Form

Khi vào trang contact, bạn thường thấy form sau:

Tên bạn: Ðịa E-Mail:

Giới tính: nữ nam

Bạn thích: xem TV đọc sách

Bạn đến từ: Bạn nói tiếng: Lời nhắn nhủ:

send clear

Dùng form này, bạn ghi vào sổ lưu bút, gửi ý kiến tới người chủ website Ðể có form trên, bạn phải viết HTML Code sau:

<form method="post" action="mailto:info@123doc.org;> Tên bạn: <input type="text" size="30" name="ten"> E-Mail: <input type="text" size="30" name="e-mail"> Giới tính:<input type="radio" value="f" name="sex" checked> nữ <input type="radio" value="m"

name="sex"> nam

Bạn thích:<input type="checkbox" value="Xem TV" name="TV"> xem TV <input type="checkbox" value="Doc sach" name="Book"> đọc sách Bạn đến từ: <select name="land"><option

value="VN">Vietnam <option value="USA"> USA <option value="De"> Germany</select>

(50)

Lời nhắn nhủ: <textarea cols="10" rows="3" name="tin">Viết vào đây</textarea>

 Cặp TAG <form></form> khai báo với browser form, cặp

TAG (cặp) TAG khác form

 Một form có phương thức (method): post get, ví dụ ta đề

cập đến phương thức post

 <action=""> định cho hành động form nút send

nhấn Trong ví dụ gửi e-mail tới địa info@123doc.org

 <input type = "text" name="ten" size="30"> tạo control cho

phép bạn nhập tên vào form Control có tên "ten", kích cỡ "30" Tên kích cỡ bạn tuỳ chọn

 <input type = "text" name="thu" size="30"> tạo control cho

phép bạn nhập e-mail vào form Control có tên "e-mail", kích cỡ "30" Tên kích cỡ bạn tuỳ chọn

 <input type="radio" value="f" name="sex" checked> nữ <input

type="radio" value="m" name="sex"> nam: cho phép bạn chọn giới tính Trong control thứ nhất, bạn thấy chữ checked đồng thời form, giới tính nữ chọn sẵn

 <select name="land"><option value="VN">Vietnam <option

value="USA"> USA <option value="De"> Germany</select> cho phép bạn chọn nước từ list có sẵn

 <select name="language" size="2"><option value="Viet">Viet

<option value="Engl"> Anh <option value="Deutsch"> Duc</select> cho phép bạn chọn tiếng từ list có sẵn size="2" có nghĩa list có dịng (bạn thấy Viet Anh)

 <textarea cols="10" rows="3" name="tin">viết vào đây</textarea>

tạo control cho phép bạn viết đoạn text dài với nhiều dòng rows cols cho phép bạn định kích cỡ control Ðây cặp TAG mà chúng bạn viết sẵn Text

(51)

"send" Nếu gõ vào nút này, tất thông tin form gửi

 <input type="reset" value="clear"> tạo nút mang tên "clear"

với tác dụng chuyển form trạng thái ban đầu

Listing (odered & unodered list)

Nếu quen sử dụng Word, bạn hỏi, làm để tạo danh sách có thứ tự (numbering - 1, 2, 3, ) có dấu chấm tròn (bullets) đầu dòng (danh sách mua đồ ăn bà xã viết tính cách bả psssst ):

Numbering Bullets

1 Mua rau tươi nhà bà Tám béo

2 Qua chợ Mơ mua chả quầy

chị Hảo vẩu cho rẻ

3 lạng thịt băm chợ Cầu

Giấy

4 gà làm sẵn chợ Vĩnh

Hồ

o Ra vẻ thích ăn đồ đắt tiền (disc) o Nhưng thực lại ki bo

(disc)

 Không thương chồng (disc)

 Lười hủi ;-) (square)

Rất đơn giản, bạn cần biết đến số TAG sau: <ol></ol> (ordered list) <ul></ul> (unordered list) <li> (list) thuộc tính TAG đó: type="disc", type="square", type="circle" Hai Lists viết HTML Code sau, bạn xem hiểu ngay:

<ol>

</ol> </font> </td>

(52)

<li>Ra vẻ thích ăn đồ đắt tiền</li>

<li>Nhưng thực lại rất ki bo</li>

<li type="disc">Không thương chồng</li>

</ul>

List bên trái (danh sách mua đồ) khơng cần giải thích <ol> nghĩa ordered list (có thứ tự 1, 2, ) List bên phải (tính cách vợ) unodered type <ul> circle nên tất đầu dòng tự động đặt còng tròn (rỗng) Riêng dịng dưới, <li> có type disc square nên đầu dòng thứ chấm đen, đầu dịng thứ lại hình vng đen

Tương tự Word, bạn dùng Style Sheets (CSS) HTML để định dạng cho trang web Thay phải viết viết lại số TAGs, bạn viết sẵn đoạn code đầu trang css file import vào trang web CSS/CSS2 có nhiều thuộc tính mà kể hết trang này, xin giới thiệu với bạn chút để bạn làm quen học thêm cách xem HTML code trang web hay Xem đoạn code bạn thấy rõ tác dụng CSS

<html>

background-color: #7083c7; color: #ffffff;

border-left: 1px solid #9dbcff; border-right: 1px solid navy; border-top: 1px solid #9dbcff; border-bottom: 1px solid navy }

.text{

(53)

font-size: 12px; }

body {

SCROLLBAR-ARROW-COLOR: #ffffff; SCROLLBAR-BASE-COLOR: #7083c7 }

</style> <body> <form>

</html>

Trong ví dụ trên, bạn thấy dịng chữ "This is a test" không nằm cặp TAG <font> </font> mà nằm <div> <div> TAG <div> mang thuộc tính class="text" có tác dụng như: <font face="arial, verdana" color="red" size="2"> Và với đoạn text khác trang Cái lợi muốn thay đổi giao diện trang, bạn không cần sửa đoạn code mà cần thay đổi thuộc tính text CSS

Thuộc tính font

 font-style: normal (thẳng) hay italic / oblique (nghiêng)

 font-variant: normal (bình thường) hay smAll-caps (hoa nhỏ

như chữ khác dịng)

 font-weight: normal (bình thường), bold, bolder (đậm) hay light,

lighter (gầy)

 font-size: cỡ chữ - giống <font size="">

o kiểu tuyệt đối: xx-small, x-small, small, medium, large, x-large xx-large

o kiểu tương đối: smaller larger

o chiều rộng: mm, cm, in (inch), pt (point), px (pixel), pc (pica)

 line-height: khoảng cách dịng chữ

o normal: bình thường

o tuyệt đối: dùng số (1.5 / / ) Ví dụ: chiều khổ chữ 10 pt line-height: 1.5 khoảng cách dịng 10 x line-heigt = 10 x 1.5 = 15 pt

(54)

Thuộc tính màu trang web

 background-attachment: thuộc tính cho phép chọn xem hình

nằm cố định trang web (fixed) hay trượt theo phần bạn xem (scoll)

 background-color: chọn màu (RGB: 255,255,255 / color name:

white / Hex: #ffffff) transparent

 background-image: cho phép bạn chọn hình làm cho trang

web

 background-position: cho phép bạn chọn điểm bắt đầu hình  background-repeat: tự động nối tiếp (repeat) / tự động nối

chiều ngang (repeat-x) / tự động nối chiều dọc (repeat-y) / khộng tự động nối tiếp (no-repeat)

Ví dụ:

<style> body{

background-image: url(images/bg.gif); background-position: 50% 50%;

background-repeat: no-repeat; background-color: black;

}

Muốn có cuộn màu trang web, bạn cần dòng code sau:

<style> body {

SCROLLBAR-ARROW-COLOR: #ffffff; SCROLLBAR-BASE-COLOR: #7083c7; }

</style>

Sổ lưu bút (guestbook), diễn đàn (forum) cho homepage

Những trang web cá nhân thường có sổ lưu bút để người thăm homepage để lại vài dòng Chắc bạn muốn biết làm để có sổ lưu bút không? Ðể tạo guestbook hay forum, bạn cần biết viết CGI, PHP ASP Nhưng không vội lo thứ vừa nêu khơng nói lên điều ;-) Bạn có thứ bạn cần Chỉ cần đăng ký dịch vụ miễn phí sau vài phút homepage bạn có guestbook lẫn forum Sau đăng ký, bạn có username,

(55)

mình:

<a href="http://two.guestbook.de/gb.cgi?gid=110699">Click here to sign my guestbook!</a>

Trong ví dụ trên, bạn thấy tơi đăng ký guestbook (cũ)

www.guestbook.de có ID 110699 Tơi đưa dịng HTML code vào menu trang web người đến thăm cần gõ vào để xem/ghi lưu bút Dưới danh sách số dịch vụ miễn phí:

Guestbook

 [Free Perl Guestbook] by Tri Dung ;-) Tơi vừa hồn thiện nốt phần

cuối Free Perl Guestbook (Version 1.0) đưa lên web để bạn [download] dùng homepage

Guestbook có điểm sau:

1 Chỉ file nhất, dễ install (upload, chmod 755 tất bạn cần làm)

2 Sau upload, bạn cần đưa địa file guestbook.cgi vào address browser gõ enter, guestbook program tự install tạo file cần thiết

3 Guestbook cho phép bạn dùng password để edit, delete entry, thay đổi giao diện, ngôn ngữ

4 Bạn lựa chọn thứ tiếng cho giao diện có sẵn: Việt, Anh, Pháp, Đức (trong Version sau nhiều nữa) download thêm thứ tiếng cần thiết

5 Khi có lỗi xảy ra, guestbook thơng báo cho bạn tự sửa lỗi

6 Guestbook cho phép bạn restore thay đổi bạn nhầm lẫn điều "nghịch" files

7 Ngồi cịn có function mail bạn có ghi lưu bút, e-mail cám ơn khách ghi lưu bút (tuỳ server bạn có hỗ trợ e-e-mail hay khơng), viết tiếng Việt có dấu (có thể tự chọn), xem kết qủa trước ghi

Địa download: http://www.vitinh.de/cgi-bin/download_guestbook.cgi

(56)

http://www.vitinh.de/downloads/guestbook/guestbook_help.htm Hy vọng bạn hài lịng!

PS GB hồn tồn FREE! Trang support viết, bạn cịn có thắc mắc làm ơn sử dụng Forum trang web Tuy bận cố gắng trả lời

 [www.guestbook.de] hỗ trợ nhiều thứ tiếng, cho phép bạn sử dụng

HTML để thay đổi giao diện sổ lưu bút Tôi dùng dịnh vụ thấy hay Bạn xem sổ lưu bút cũ thấy

 [www.bravenet.com] Bravenet cho bạn sổ lưu bút lẫn diễn đàn,

cũng hay khả thay đổi giao diện Guestbook.de

 [HTMLGear] Tôi chưa dùng ghi lưu bút thấy

hay HTMLGear có thêm function preview để người ghi xem trước gửi

 [TheGuestbook] Cũng hay, thấy net mà chưa thử

cài Forum

 [ForumCo.com] đăng ký sử dụng thử biết, chán chuyển sang

dịch vụ khác ;-)

 [www.bravenet.com] nói mục lưu bút: dùng tốt!

Nếu có thời gian kiên nhẫn, bạn học thêm PERL, ASP, PHP để tự viết cho Guestbook hay Forum download phần mềm viết sẵn sửa cho hợp để dùng Một địa hay cho thích mày mò học theo kiểu "learning by doing" là: www.cgi-resources.com Nếu bạn khơng hài lịng với tơi nêu trên, tìm thêm www.google.com với từ khóa sau: free guestbook, free forum

free guestbook, free forum Find free services

(57)

www your-domain-here tk register

Các bạn có Homepage đặt [các dịch vụ Webspace miễn phí] có lần tự hỏi, làm cách để bỏ Popup để người xem đỡ rối mắt Bỏ bao ngày đêm làm trang web thật vừa mắt với hình ảnh đẹp mà bị đống rác Popup che hết kể tức Cũng có nhiều bạn viết thư hỏi Trong trang web này, xin giới thiệu với bạn cách phá Popup cho nhiều FWP khác Nhưng trước đọc tiếp, bạn nên biết số điều sau:

 Phá Popup đồng nghĩa với không tuân theo Term Of Service (TOS)

FWP nên họ có quyền "đá đít" bạn xóa hẳn homepage bạn lúc Vì lý này, bạn nên tạo cho trang web địa độc lập (redirect - ví dụ: www.tenban.tk come.to/tenban) , khơng liên quan tới provider nơi bạn dặt trang web đề phòng họ phát cấm địa bạn Khi bạn cần thay đổi

TARGET URL xong

 Nếu làm bạn FWP sống gì?

 Và điều quan trọng là: bạn chưa đọc TOS, bạn không quan

tâm đến sống cịn FWP họ có địa E-Mail bạn để bán xác suất bị "đá đít" nhỏ, "đá đít" bạn làm account ;-)

Nếu bạn đồng ý với tơi nêu làm ơn tiếp tục! Nếu khơng biết HTML, bạn nên đọc [trang này] trước!

Nếu chấm từ (kém nhất) đến 10 (tốt nhất), bạn cho iHTML điểm? Làm ơn chọn nhấn nút Vote Ðể xem nhận xét bạn đọc, nhấn nút View!

Vote

V3 Forwarder (come.to/tenban) & dot.tk

[Come.to] [dot.tk] cung cấp dịch vụ Forward Nếu bạn Geocities, địa bạn www.geocities.com/tenban Ðịa dài khó nhớ come.to/tenban V3 www.tenban.tk dot.tk Khi đăng ký V3, bạn có lựa chọn nhiều kiểu quảng cáo khác nhau, chọn Frame! Dot.tk tự chèn trang bạn vào Frame tung Popup quảng cáo Ðưa dòng code sau vào đầu HTML code trang chủ để phá Frame quảng cáo:

(58)

</script>

250free.com

[250free.com] cho phép bạn upload 250 MB tặng kèm theo banner, popups đủ loại Ðể phá quảng cáo, thay TAG <body> HTML Code trang bằng:

td = "<bo"; pn = "dy>";

document.write(td+pn); </script>

và </body> bằng:

td = "</bo"; pn = "dy>";

document.write(lt+jr); </script>

250free thay đổi thường xuyên Banner-Code họ ln tìm cách vơ hiệu hóa dòng code bạn Nếu bạn thấy Banner Bravenet [trên trang Test này], làm ơn thông báo cho [Forum]

(59)

[batcave.net] [0catch.com] tặng bạn 100 MB banner, popups Ðể phá quảng cáo họ, bạn thêm đoạn code (màu đỏ) vào sau TAG <html> HTML code:

<html>

<! Banner Killer by www.tridung.de > <noscript>

<head>

<title>Your web page title</title> </head>

<body>

Batcave thay đổi thường xuyên Banner-Code họ tìm cách vơ hiệu hóa dịng code bạn Nếu bạn thấy Banner Batcave [trên trang Test này], làm ơn thông báo cho [Forum] Ðây lời giải đáp thắc mắc bạn Mai Thi Kieu Nuong (18.11.2002) Chúc bạn thành công!

Bravenet.com

[bravenet.com] cung cấp đủ thứ, Popups Banner Ðưa dòng code đỏ sau vào sau tag <html> HTML code trang để phá:

<html>

<body>

Bravenet thay đổi thường xun Banner-Code họ ln tìm cách vơ hiệu hóa dịng code bạn Nếu bạn thấy Banner Bravenet [trên trang Test này], làm ơn thông báo cho [Forum]

Crosswinds.net

(60)

từng trang để "tóm gọn" đóng Popup vừa mở ra: <script language="JavaScript">

var winname1="jW4Lo"; var winname2="s9wh";

var windowname=winname1+winname2;

handle = window.open("index.htm", windowname); handle.close();

</script>

PS: Crosswinds khơng tìm cách phá code bạn, họ xóa thẳng tay trang web bạn, sau nhiều lần họ xóa hẳn account Tôi tạo account crosswinds.net bị họ xóa Nếu bạn muốn sử dụng crosswinds đành phải chấp nhận popup họ dùng đoạn code phần [Hide Popup]

Fortunecity.com

[Fortunecity.com] cho bạn sử dụng 100 MB quấy rầy bạn Popups Ðưa dòng code sau vào trước TAG <body> trang để phá:

<! function td() { return true; } window.onerror = td;

// >

</script></head>

</script> </noscript>

Freepage

[Freepage] cho bạn sử dụng 20 MB quấy rầy bạn Frame Ðưa dòng code sau vào HTML code trang chủ để phá Frame:

(61)

</script>

Geocities.com

Định dạng
Số trang	61
Dung lượng	93,53 KB