Ngôn ngữ HTML

Giới thiệu ngôn ngữ HTML Định dạng văn bản Danh sách Hình ảnh – Âm thanh – Liên kết Bảng và trình bày trang - Khung Biểu mẫu (Form) – Kết xuất

ppt152 trang | Chia sẻ: thuongdt324 | Ngày: 01/12/2020 | Lượt xem: 12 | Lượt tải: 0download
Bạn đang xem trước 20 trang tài liệu Ngôn ngữ HTML, để xem tài liệu hoàn chỉnh bạn click vào nút DOWNLOAD ở trên
PHẦN 1: NGÔN NGỮ HTML (Hypertext Markup Language) 1Nội DungBảng và trình bày trang - Khung Hình ảnh – Âm thanh – Liên kết Danh sách Định dạng văn bản Giới thiệu ngôn ngữ HTML Biểu mẫu (Form) – Kết xuất2GiỚI THIỆU NGÔN NGỮ HTMLHTML (Hyper Text Markup Language): Ngôn ngữ đánh dấu siêu văn bảnLà một ngôn ngữ dùng để xây dựng một trang Web.Chứa các thành phần định dạng để báo cho trình duyệt Web biết cách để hiển thị một trang Web.Một trang web thông thường gồm có 2 thành phần chính:Dữ liệu của trang web (văn bản, âm thanh, hình ảnh...)Các thẻ (tag) HTML dùng để định dạng mô tả cách thức các dữ liệu trên hiển thị trên trình duyệt.CÁC KHÁI NiỆM LIÊN QUAN TỚI THẺKhái niệm thẻCú pháp tổng quát:TagName: tên tag HTML được đặt giữa hai dấu ngoặc nhọn ( ) để báo cho trình duyệt biết cách thể hiện văn bản. Property: thuộc tính của thẻ, cung cấp các tuỳ chọn cho thẻ. Các thuộc tính cách nhau bởi khoảng trắng. Thuộc tính thường có trị (value) xác định cách tác động của thẻ. Không phân biệt chữ hoa chữ thường. CÁC KHÁI NiỆM LIÊN QUAN TỚI THẺKhái niệm thẻCÁC KHÁI NiỆM LIÊN QUAN TỚI THẺ2. Thẻ chứa (Container tag) Thẻ mở (Opening thẻ): Thẻ đóng (Closing thẻ): Các thành phần đặt giữa thẻ mở và thẻ đóng chịu tác động của thẻ đó.Ví dụ: Xin chào bạn Nguyễn AnCÁC KHÁI NiỆM LIÊN QUAN TỚI THẺ3. Thẻ rỗng (Empty tag) Chỉ có thẻ mở không có thẻ đóng dùng để hiển thị yêu cầu 1 lần. Ví dụ: xuống dòng , chèn đường kẻ ngang Lưu ý: Khi soạn thảo nhấn phím Space (nhiều ký tự trắng), Enter (xuống dòng) không có hiệu lực khi hiển thị trên trình duyệt mà phải dùng các thẻ.CÁC KHÁI NiỆM LIÊN QUAN TỚI THẺ4. Các thẻ lồng nhauCác thẻ có thể lồng nhau, nội dung nào nằm trong nhiều thẻ sẽ chịu tác động của các thẻ đó. Lưu ý: mở trước đóng sau/mở sau đóng trước.Ví dụ: Chào bạn đến với WebSite trung tâm ABC 1. Cấu trúc Title of Web pageNội dung thông tin của trang web Nội dung hiển thị trên trình duyệt 2. Soạn thảoDùng Notepad, Wordpad, Word3. Hiển thịKhởi động trình duyệt Internet ExplorerChọn menu file,open, dùng browse tìm tập tin html mới tạoHoặc double click vào tên tập tin .htmCẤU TRÚC CƠ BẢN CỦA TRANG WEB CẤU TRÚC CƠ BẢN CỦA TRANG WEB CÁC TAG HTML CƠ BẢN là dòng đầu tiên của trang HTML, ghi thông tin về version HTML dùng trong trang HTML này. Ví dụ: định nghĩa phạm vi của văn bản HTML. định nghĩa các mô tả về trang HTML. Các thông tin này sẽ không hiển thị trong nội dung trang web.CÁC TAG HTML CƠ BẢN Nội dung tiêu đề mô tả tiêu đề của trang, thường được hiển thị trên thanh tiêu đề của cửa sổ hiển thị trang web. Tiêu đề được dùng khi bookmark trang Web này và làm chỉ mục khi tìm kiếm trang Web (search engines index). trình duyệt web bỏ qua không đọc, không hiển thị trên trang Web. Lưu ý: Không được có khoảng trắng giữa tương tự CÁC TAG HTML CƠ BẢN xác định phần "thân" của trang web.Các thuộc tính của BgColor: thiết lập màu nền của trangText: thiết lập màu chữLink: màu của siêu liên kếtVlink: màu của siêu liên kết đã xem quaBackground: load một hình làm nền cho trangLeftMargin: Canh lề trái TopMargin: Canh lề trên của trangCÁC TAG HTML CƠ BẢN CÁC TAG HTML CƠ BẢN HREF: khai báo URL gốc của tài liệu (dùng để tạo URL tương đối). TARGET: quy định đích đến mặc định cho các link trong trang Web. đặt ở giữa , thường dùng quy định thuộc tính cho trang web NAME: nhúng thêm thông tin. HTTP-EQUIV: tự động chuyển đến trang Web khác và ấn định ngôn ngữ viết kịch bản mặc định. Ví dụ: CÁC TAG HTML CƠ BẢN (horizontal rule) thêm đường kẻ ngang. Cú pháp: CÁC TAG HTML CƠ BẢN Một số giá trị màu cơ bản CÁC TAG HTML CƠ BẢN (horizontal rule) thêm đường kẻ ngang. Ví dụ:Welcome to HTML My first HTML document This is going to be real funCÁC TAG HTML CƠ BẢN ngắt xuống dòng mới nhưng vẫn thuộc cùng đoạn. Ví dụ: nguyen Chu thich cach 2 Chao ban den voi WebSite trung tam ABC Chao ban den voi WebSitetrung tam ABC Chao ban den voi WebSite trung tam ABCCÁC TAG HTML CƠ BẢN Một số thao tác trong cửa sổ trình duyệt Cách load lại trang Web: Click biểu tượng Refresh (F5) trên thanh công cụ.Chỉnh sửa size chữ hiển thị trên trang: Chọn Menu View>Text sizeChỉnh lại font chữ: Chọn Menu View->EndCodingTrong trường hợp trang Web không hiển thị được Font tiếng Việt: Chọn menu Tool chọn Internet Options->Chọn Tab Fonts chọn Font tiếng Việt Nếu chọn rồi mà không hiển thị được font tiếng Việt thì chọn Menu View>EndCodingchọn các font như User defined,Vietnamese.CÁC TAG HTML CƠ BẢN Một số thao tác trong cửa sổ trình duyệt Các tuỳ chọn khác cho trang Web: Tools  Internet option: Không Load hình xuống, định dạng liên kết, Chọn trang web mặc định khi mở trình duyệt CÁC TAG HTML CƠ BẢN Một số thao tác trong cửa sổ trình duyệt Các tuỳ chọn khác cho trang Web: Tools  Internet option: Không Load hình xuống, định dạng liên kết, Chọn trang web mặc định khi mở trình duyệt Use Current: chọn trang hiện tại để load lên mỗi lần khởi động IEUse Default: địa chỉ trang Web mặc định mỗi khi mở trình duyệt History: lưu lại các trang web đã duyệt qua tại máy Client và thông tin đăng nhập của user hiện hànhNếu khộng muốn lưu lại: Chọn Delete Cookies và Delete Files.Có thể thiết lập khoảng thời gian lưu trữ trang trong đối tượng History bằng cách thay đổi giá trị trong ô “Days to keep pages in history” .Nếu muốn xoá đối tượng này thì nhấn Clear history CÁC TAG HTML CƠ BẢN Một số thao tác trong cửa sổ trình duyệt Ngăn chặn không cho tải hình xuống trang webMàu liên kết, cách thể hiện liên kết trên trangCopy hình ảnh từ trang Web: Click phải vào hình ảnh cần sao chép rồi chọn Save picture as, hoặc Save background as,Load về trang Web bao gồm các hiệu ứng, script, hình ảnh chứa trên trang: Chọn Menu File  Save As  Chọn vị trí lưu file Save. Hiệu chỉnh trang Web: View source->hiệu chỉnhchọn File  Save để lưu lại F5 để cập nhật lại nội dung vừa hiệu chỉnhĐỊNH DẠNG VĂN BẢN – Định dạng ký tựCác thẻ thường dùng ĐỊNH DẠNG VĂN BẢN – Định dạng ký tựTag : định dạng chữ đậm Cú pháp: Nội dung chữ đậmTag : Định dạng chữ nghiêngCú pháp: Nội dung chữ nghiêngTag : Gạch chân văn bảnCú pháp: Nội dung chữ gạch chânTag và : Chỉnh cỡ chữ to hoặc nhỏ hơncỡ chữ xung quanhCú pháp: Nội dung chữ to Nội dung chữ nhỏ Tag và :Đưa chữ lên cao hoặc xuống thấp so với văn bản bình thườngCú pháp: Nội dung chữ đưa lên cao Nội dung chữ đưa xuống thấp Ví dụ H2O Ax2+Bx+C=0ĐỊNH DẠNG VĂN BẢN – Định dạng ký tự: Gạch ngang văn bảnCú pháp: Nội dung văn bản bị gạch ngang: Văn bản được nhấn mạnh (giống tag )Cú pháp: Văn bản được nhấn mạnh: Định dạng chữ đậm (giống )Cú pháp: Văn bản được nhấn mạnhĐỊNH DẠNG VĂN BẢN – Định dạng ký tựVí dụĐỊNH DẠNG VĂN BẢN – Định dạng ký tự: Giữ nguyên các định dạng như: ngắt dòng, khoảng cách, thích hợp với việc tạo bảngCú pháp: Nội dung văn bản cần định dạng trước với tất cả định dạng khoảng cách, xuống dòng và ngắt hàngVí dụ Chào bạn đến với WebSite trung tâm ABC ĐỊNH DẠNG VĂN BẢN – Định dạng ký tự: Giữ nguyên các định dạng như: ngắt dòng, khoảng cách, thích hợp với việc tạo bảngVí dụ:Learning HTML Humpty Dumpty sat on a wall All the King’s horsesĐỊNH DẠNG VĂN BẢN – Định dạng ký tự thẻ tt:chữ đánh máy(typewriter) thẻ cite: hiển thị dạng chú thích : Dùng để nhập một dòng mã có định dạng ký tự riêng. Dòng mã này không được thực hiện mà được hiển thị dưới dạng văn bản bình thường Cú pháp: Nội dung văn bản muốn định dạng Ví dụ: If (x > 0) x = x + 1 else y = y + 1 ĐỊNH DẠNG VĂN BẢN – Định dạng ký tự: Định dạng Font chữ cho cả tài liệu thì đặt tag trong phần Định dạng từng phần hoặc từng từ thì đặt tại vị trí muốn định dạngCú pháp:contentVí dụ: This is a paragraph. ĐỊNH DẠNG VĂN BẢN – Định dạng font: Ví dụ: //basefont: định dạng cho toàn trang web dong lenh 1 dong lenh 2dong lenh 3 dong lenh 4 dong lenh 5ĐỊNH DẠNG VĂN BẢN – Định dạng font: Ví dụ: Welcome to HTML My first HTML document This is going to be real funĐỊNH DẠNG VĂN BẢN – Định dạng font : Dùng để ngắt đoạn và bắt đầu đoạn mới Cú pháp: Nội dung của đoạn Ví dụ: Mary had a little lamb It’s fleece was white as snow Everywhere that Mary went She was followed by a little lambĐỊNH DẠNG VĂN BẢN – Định dạng đoạn văn bảnHeading : Tạo header, gồm 6 cấp header, đặt trong phần BODY : the largest heading. : the smallest heading Content Heading Direction [left, right, center]Ví dụ: Heading 1Heading 2Heading 3Heading 4Heading 5Heading 6ĐỊNH DẠNG VĂN BẢN – Định dạng đoạn văn bản: Dùng phân cách một khối văn bản để nhấn mạnh, đoạn văn bản này được tách ra thành một paragraph riêng, thêm khoảng trắng trên và dưới đoạn đồng thời thụt vào so với lề trái (tương đương chức năng của phím tab)Cú pháp: Nội dung khối văn bản nhấn mạnh ĐỊNH DẠNG VĂN BẢN – Định dạng đoạn văn bản: Ví dụ: Learning HTML Humpty Dumpty sat on a wall Humpty Dumpty had a great fall ĐỊNH DẠNG VĂN BẢN – Định dạng đoạn văn bản : Chia văn bản thành các khối, có chung một định dạng chia văn bản thành một khối bắt đầu từ một dòng mới. tách khối nhưng không bắt đầu từ một dòng mớiCú pháp: Nội dung của khối bắt đầu từ một dòng mới Nội dung của khối trong 1 dòng ĐỊNH DẠNG VĂN BẢN – Định dạng đoạn văn bảnĐỊNH DẠNG VĂN BẢN – Định dạng đoạn văn bản:ĐỊNH DẠNG VĂN BẢN – Định dạng đoạn văn bản : Dùng để điểu khiển đối tượng chạy một cách tự động trên trang WebCú pháp: ObjectCác thuộc tính của Marquee : Direction =up/ down / left / right dùng để điều khiển hướng chạy. Behavior=alternate: đối tượng chạy từ lề này sang lề kia và ngược lại.Ví dụ: Đối tượng chạy lên ĐỊNH DẠNG VĂN BẢN – Chuyển động : các thuộc tínhĐỊNH DẠNG VĂN BẢN – Một số ký tự đặc biệtLớn hơn (>): > Ví dụ: If A > B Then A = A + 1 Nhỏ hơn ( If A < B Then A = A + 1 ĐỊNH DẠNG VĂN BẢN – Một số ký tự đặc biệtCặp nháy””: "Ví dụ: " To be or not to be? " That is the questionKý tự và &: &Ví dụ: William & Graham went to the fairKý tự khoảng trắng:  ĐỊNH DẠNG VĂN BẢN – Một số ký tự đặc biệtĐỊNH DẠNG VĂN BẢN – Một số ký tự đặc biệt1. Danh sách không có thứ tự (Unorder List -UL) Cú pháp: Nội dung 1 Nội dung 2 Shape 1, Shape 2 là loại bullet tự động đặt ở đầu dòng trong danh sáchShape 1: ảnh hưởng đến toàn danh sáchShape 2: ảnh hưởng đến một mục trong danh sáchCác loại shape:Circle: Bullet tròn, rỗngSquare: Bullet vuôngDisc: Bullet tròn không rỗngDANH SÁCH 1. Danh sách không có thứ tự (Unorder List -UL) Ví dụ:An Unordered List: Coffee Tea MilkDANH SÁCH 1. Danh sách không có thứ tự (Unorder List -UL) Ví dụSo thich : Xem phim hoat hinh Di hoc dung gio Lam bai tap An kem DANH SÁCH 1. Danh sách không có thứ tự (Unorder List -UL) Ví dụ:Learning HTML Monday Introduction to HTML Creating Lists Tuesday Creating Tables Wednesday Thursday DANH SÁCH 2. Danh sách có thứ tự (Order List -OL) Cú pháp: Nội dung 1 Nội dung 2 x: loại ký tự muốn sử dụng trong danh sách gồm :A: Chữ hoa, a: Chữ thườngI: Số la mã hoa, i: Số la mã thường1: Cho số mặc địnhn: giá trị đầu tiên của danh sáchx1: là loại ký tự sử dụng cho dòng này và dòng tiếp theo, làm mất ảnh hưởng của xm: giá trị đầu tiên của dòng này, làm thay đổi giá trị của nDANH SÁCH 2. Danh sách có thứ tự (Order List -UL) Ví dụ: An Ordered List: Coffee Tea MilkDANH SÁCH 2. Danh dách lồng nhau - A nested list:A nested List: Coffee Tea Black tea Green tea MilkDANH SÁCH 3. Danh sách định nghĩaLà danh sách dùng lập danh sách các thuật ngữ, các định nghĩa ...Mỗi mục gồm hai phần: phần thuật ngữ và chi tiết thuật ngữ này Cú pháp: Nhập từ muốn định nghĩa Nhâp nội dung định nghĩa DANH SÁCH 3. Danh sách định nghĩaLearning HTML Definition ListPixel Short for picture element. A pixel refers to the small dots that make up an image on the screen. Pixel depth refers to the number of colours which may be displayed.ResolutionThe quality of the display on a monitor. The higher the resolution, the sharper the image. The number of pixels that can be displayed on a screen defines resolution.Scanner A hardware device that allows the user to make electronic copies of graphics or text.DANH SÁCH 1. Giới thiệuSiêu liên kết cho phép người truy cập có thể duyệt từ trang web này đến trang web khác. Một liên kết gồm 3 phần:Nguồn: chứa nội dung hiển thị khi người dùng truy cập đến, có thể là một trang web khác, một đoạn film, một hình ảnh hoặc một hộp thoại để gửi mailNhãn: có thể là dòng văn bản hoặc hình ảnh để người dùng click vào khi muốn truy cập đến liên kết, nếu nhãn là văn bản thì thường được gạch dướiĐích đến (target): xác định vị trí để nguồn hiển thị.SIÊU LIÊN KẾT Các loại liên kếtInternal Hyperlink (Liên kết trong): là các liên kết với các phần trong cùng một tài liệu hoặc liên kết các trang trong cùng một web site.External Hyperlink (Liên kết ngoài): là các liên kết với các trang trên web site khác.2. Tạo siêu liên kếtCú pháp: Nhãn URL: Địa chỉ của trang liên kếtNhãn: Có thể là dòng text hoặc hình ảnh hoặc một buttonSIÊU LIÊN KẾT Dùng URL tương đối để liên kết đến các trang trong cùng một website Ví dụ: Using links Click here to view document 2 Dùng URL tuyệt đối để liên kết đến các trang trong website khác Ví dụ: liên kết đến GoogleSIÊU LIÊN KẾT 3. Tạo BookMark: khi nội dung quá dài nhảy đến một phần cụ thể trên trang Web hiện hành Nhãn Nội dungTạo liên kết đến Bookmark: Nhãn của text liên kếtVí dụ : Using htm links InternetIntroduction to HTMLInternet Internet là một mạng của các mạng... Introduction to HTML Ngôn ngữ đánh dấu siêu văn bản là ngôn ngữ chuẩn  Kết quả trên trình duyệtsiêu liên kếtSIÊU LIÊN KẾT 3. Liên kết với một Bookmark ở một tài liệu khác Ví dụ: Trang main.htm Main document Internet Introduction to HTMLSIÊU LIÊN KẾT 3. Liên kết với một Bookmark ở một tài liệu khác Trang Doc1.htm Using Links Internet Internet là một mạng của các mạng. Nghĩa là, mạng máy tính được liên kết với các mạng khác, nối với các nước và ngày nay là toàn cầu. Giao thức truyền TCP/IP cung cấp liên kết với tất cả các máy tính trên thế giới. Introduction to HTML Ngôn ngữ đánh dấu siêu văn bản là ngôn ngữ chuẩn mà web sử dụng để tạo và nhận ra tài liệu. Mặc dù không phải là một tập con của ngôn ngữ nâng cấp tiêu chuẩn tổng quát (SGML), ngôn ngữ đánh dấu siêu văn bản cũng có liên quan với SGML. SGML là một phương pháp trình bày các ngôn ngữ định dạng tài liệu. HTML là ngôn ngữ đánh dấu được sử dụng để tạo tài liệu HTML. SIÊU LIÊN KẾT 3. Liên kết đến hộp thư e-mailCú pháp: NhãnNếu siêu liên kết đặt ở cuối trang thì dùng tag Cú pháp: NhãnSIÊU LIÊN KẾT 3. Liên kết đến hộp thư e-mail This is an email link: Send Mail Note: Spaces between words should be replaced by %20 to ensure that the browser will display the text properly. SIÊU LIÊN KẾT 4. Một số tùy chọnĐịnh cửa sổ hiển thị trang khi nhấn liên kết: khi nhấp chuột vào liên kết thì mặc định trang kết quả sẽ hiển thị tại cửa sổ hiện tại. SIÊU LIÊN KẾT “_self”hiển thị trên cửa sổ hiện tại (mặc định). “_blank” hiển thị trên một cửa sổ mới. “name” hiển thị trên cửa sổ hoặc frame có tên name Khai báo đích đến mặc định cho các liên kết trong trang 5. Bỏ gạch dưới trong liên kết Phím tắt cho liên kết NhanLienKet Trong Windows, phím tắt dùng kết hợp với phím ATL. Netscape không hỗ trợ phím tắt.SIÊU LIÊN KẾT 6. Một số lưu ý khi dùng liên kếtNên tạo chú thích cho liên kết giúp người đọc biết được trang cần tới.Nên dùng một màu thống nhất cho tất cả các liên kết.Khi link không chỉ tới trang html mà tới một tài liệu như Word, Excel, PDF... thì bạn nên tạo biểu tượng của nó bên cạnh link.Đừng tạo link tới trang đang xây dựng.SIÊU LIÊN KẾT 1. Một số thông tin về hình ảnh.GIF (Graphic Interchange Format): Pallete: 256 màu. Thông dụng, dùng làm banner logo, button, icon, link Trong suốt (Transparent).Interlace: brower sẽ hiển thị ảnh ngay khi chưa tải đầy đủ ảnh, tạo cảm giác ảnh đươc tải nhanh.Có thể dùng làm ảnh động (animated).HÌNH ẢNH1. Một số thông tin về hình ảnh.JPG ( JPEG: Joint Photographic Experts Group): đẹpLà loại ảnh nén mất thông tin, nghĩa là ảnh sau khi bị nén không giống như ảnh gốcPallete: hỗ trợ hơn 16 triệu màu và thường được sử dụng cho các ảnh có màu thực.Độ nén cao, với cùng số màu ảnh JPG có kích thước nhỏ hơn ảnh GIF.Không trong suốt.HÌNH ẢNH1. Một số thông tin về hình ảnh.PNG (Portable Network Graphics)Pallete: chọn lọc mở rộng 24-bit màu thật RGB, sắc xám và GIF 8-bit bảng màu và nén ít tổn thất hơn, PNG có các kênh alpha, cho bạn tinh chỉnh nhiều hơn GIF’s một lớp transparency, và có thể mô phỏng ảnh 3DKhông hỗ trợ họat hình, sử dụng cho các ảnh màu cao và ảnh chất lượng cao.BMP (Bitmap): đẹp nhất. Chỉ IE hỗ trợ.Kích thước lớn.HÌNH ẢNH2. Chèn hình ảnh, videoCú pháp: HÌNH ẢNH2. Chèn hình ảnh, videoHÌNH ẢNHsrc=”url”Chỉ định đường dẫn tập tin ảnh cần chèn. Có thể là địa chỉ tham chiếu tuyệt đối hay tương đối. src=“../images/hinh1.gif” src=“hinh1.gif” //trong cùng thư mục file htmlKhông nên liên kết tập tin hình ảnh bằng địa chỉ url của đĩa cứng.Thông thường các tập tin ảnh được lưu trong thư mục riêng để dễ quản lý các tập tin trong website Ví dụ: 2. Chèn hình ảnh, videoHÌNH ẢNHalign= “AlignType” Canh hàng hình ảnh so với văn bản left / right / top / middle / bottom / texttop / absmiddle / baseline Ví dụ: An image with align="bottom". An image with align="middle". An image with align="top". Tip: align="bottom" is default! An image before the text. An image after the text. HÌNH ẢNH2. Chèn hình ảnh, videoHÌNH ẢNHalt=”AlternativeText” Tạo chú thích cho hình chèn vào trang WebMột số trình duyệt không hỗ trợ hình ảnh hoặc người dùng xác lập không hiển thị hình hay không tải hình. Trong trường hợp này hình được thay bằng một khung trống. Do đó nên tạo các chú thích (alternate text) để hiển thị thay hình ảnh.Trình duyệt IE 3.0 và Netscape 4.0 trở về sau thường hiển thị chú thích dưới dạng TOOL TIP khi trỏ chuột vào ảnh. 2. Chèn hình ảnh, videoHÌNH ẢNHwidth=”n”height=”n”Xác lập kích thước ảnh, giúp trình duyệt dự trữ chỗ trống cần thiết cho ảnh hiển thị và tiếp tục tải các văn bản sau, có thể làm trang Web được nạp nhanh hơn.Tránh việc lạm dụng width, height để thay đổi kích thước ảnh vì có thể làm biến dạng ảnh.n: có thể tính bằng pixel hay tỷ lệ phần trăm so với đối tượng chứa nó. Ví dụ: Image HÌNH ẢNH A paragraph with an image. The align attribute of the image is set to "left". The image will float to the left of this text. A paragraph with an image. The align attribute of the image is set to "right". The image will float to the right of this text.2. Chèn hình ảnh, videoHÌNH ẢNHborder=”n”vspace=”n”hspace=”n”Chỉ định độ dày đường viền bao quanh ảnh.Đơn vị: pixel. n=0: không có đường viền.Qui định khoảng trắng xung quanh hình.vspace: trên và dưới hình.hspace: trái và phải hình.2. Chèn hình ảnh, videoHÌNH ẢNHlowsrc=”url” Thuộc tính cho phép hiển thị lần lượt hai hình cùng một vị trí. Thường dùng nạp hình có kích thước nhỏ trước trong khi chờ nạp hình có kích thước lớn hơn để tạo cảm giác hình được nạp từ trạng thái thô sang chi tiết.dynsrc =”url”Chỉ định đường dẫn tập tin ảnh cần chèn. Một số định dạng phim: .MPG, .MPEG (thông dụng nhất dành cho phim trên WEB), .AVI, .MOV, .WMV 2. Chèn hình ảnh, videoHÌNH ẢNHstart =”fileopen/mouseover”Chỉ định video sẽ được chơi khi tài liệu được mở hay khi trỏ con chuột vào nó. Có thể kết hợp cả hai giá trị này nhưng phải phân cách chúng bởi dấu phẩy loop =”n/infinite” Chỉ định số lần chơi. Nếu LOOP = INFINITE thì file video sẽ được chơi vô hạn lần. HÌNH ẢNHVí dụQui định đi xe buýt: Lên xuống xe đúng điểm dừng. Lên xuống xe đúng cửa. Mua vé và giữ vé để kiểm tra. Giữ gìn vệ sinh chung trên xe. Dùng ảnh làm liên kết:Có thể dùng hình ảnh để tạo một liên kết đến một trang khác, hoặc nếu có một ảnh lớn, bạn có thể tạo ảnh nhỏ hơn hoặc một biểu tượng cho nó để nó có thể hiển thị nhanh chóng trên trang web, sau đó tạo liên kết để đưa người truy cập đến ảnh có kích thước thậtCú pháp: Nhãn HÌNH ẢNHDùng ảnh làm liên kết: Create a link of an image: No border around the image, but still a link: HÌNH ẢNHBản đồ ảnh: Bản đồ ảnh là một ảnh trong trang web được chia ra làm nhiều vùng, mỗi vùng khi click vào sẽ liên kết đến một địa chỉ URLCách tạo:Trước hết phải chèn vào trang một ảnh và đặt nhãn cho ảnh HÌNH ẢNHBản đồ ảnh: Trong đó: