giáo trình htlm

Giáo Trình HTML (XHTML) CSS Biên soạn : Nguyễn Minh Thành Tp.HCM, 2010 Mục Lục Bài TỔNG QUAN VỀ THIẾT KẾ WEB 1.1 Các khái niệm bản: 1.1.1 Web Tĩnh 1.1.2 Web Động 1.1.3 Mạng Internet 1.1.4 Các dịch vụ Internet 1.1.5 HTTP – Hyper Text Transfer Protocol 1.1.6 HTML – Hyper Text Markup Language 1.1.7 Webpage – trang web 1.1.8 Website 1.1.9 Homepage 1.1.10 Web Server 1.1.11 Tên miền – Domain Name – Web Server Name .9 1.1.12 Hosting .9 1.1.13 URL – Uniform Resource Location 10 1.1.14 Browser 10 1.2 Soạn Thảo Trang Web .10 1.2.1 Chương trình soạn thảo 10 1.2.2 Đặt tên, lưu & mở tập tin .10 1.2.3 Xem trang web sau soạn thảo 11 Bài GIỚI THIỆU VỀ HTML - XHML 12 2.1 Định nghĩa HTML .12 2.2 Cấu trúc trang Web 12 2.2.1 Doctype 12 2.2.2 Cây văn HTML .15 2.2.3 Thiết lập thuộc tính cho phần tử 16 2.2.4 Sự khác HTML XHTML 17 2.3 Các kí tự đặc biệt .18 Bài HEAD ELEMENTS - CÁC PHẦN TỬ ĐẦU TRANG WEB 19 3.1 head 19 3.2 base 19 3.3 link 20 3.4 meta 21 3.5 script 22 3.6 style 23 3.7 title 24 Bài CÁC PHẦN TỬ CẤU TRÚC 25 4.1 html 25 4.2 body 25 4.3 h1, h2, h3, h4, h5, h6 26 4.4 p 26 4.5 blockquote 27 4.6 br 28 4.7 hr 29 4.8 div 30 Bài CÁC PHẦN TỬ ĐỊNH DẠNG KÍ TỰ - VĂN BẢN 31 5.1 b 31 5.2 i .31 5.3 u 31 5.4 font 31 5.5 big 32 5.6 strong 32 5.7 small 32 5.8 em .32 5.9 tt .33 5.10 abbr .33 5.11 acronym 33 5.12 basefont 33 5.13 bdo 33 5.14 blink 34 5.15 center 34 5.16 address 34 5.17 cite .34 5.18 code .34 5.19 var 34 5.20 plaintext 34 5.21 comment .34 5.22 nobr .35 5.23 strike .35 5.24 sup 35 5.25 sub 35 5.26 dfn 35 5.27 kbd 35 5.28 pre 36 5.29 marquee 36 5.30 span .37 Bài TẠO DANH SÁCH 38 6.1 ul, li 38 6.2 ol, li 38 6.3 dl, dt, dd 39 6.4 Danh sách lồng 40 Bài CHÈN HÌNH ẢNH, MEDIA VÀ LIÊN KẾT 41 7.1 img 41 7.2 embed .41 7.3 object 41 7.4 bgsound 42 7.5 applet 42 7.6 area 43 7.7 a 43 Bài CHÈN BẢNG 44 8.1 table, caption, th, tr, td .44 Bài TẠO BIỂU MẪU - FORM 46 9.1 Giới thiệu 46 9.2 Định nghĩa Form 46 9.3 Các thành phàn Form 46 9.3.1 Textbox – hộp văn 46 9.3.2 Hidden – thông tin ẩn 47 9.3.3 Password – hộp mật 47 9.3.4 Checkbox – hộp kiểm 47 9.3.5 Radio Button – nút chọn 47 9.3.6 File Upload – hộp tải file .47 9.3.7 Button - Nút lệnh 47 9.3.8 Combobox - hộp danh sách 48 9.3.9 Listbox – hộp danh sách nhiều 48 9.3.10 Textarea – khung văn 48 9.3.11 Submit Button – nút gửi liệu 48 9.3.12 Reset Button – nút phục hồi liệu 48 9.3.13 Một vài ví dụ 49 Bài 10 TẠO KHUNG - FRAME .53 10.1 Thiết kế Frame 53 10.2 frameset 53 10.3 frame .53 10.4 noframe 54 10.5 Ví dụ .54 Bài 11 11.1 CHỌN BỐ CỤC & TỔ CHỨC WEBSITE 56 Tổ chức website 56 11.1.1 Các tập tin HTML Website 56 11.1.2 Trang chủ Website .56 11.1.3 Tổ chức lưu trữ Website .56 11.1.4 Địa tương đối & Địa tuyệt đối 57 11.2 Chọn bố cục cho trang web 57 11.2.1 Độ phân giải hình 57 11.2.2 Chế độ màu 58 11.3 Bài 12 Bố cục cho trang web 58 GIỚI THIỆU VỀ CSS (Cascading Style Sheet) 60 12.1 Giới thiệu 60 12.2 Các cách thiết kế CSS 60 12.2.1 Thiết kế chung phần tử 60 12.2.2 Nhúng Style 60 12.2.3 Liên kết đến file CSS .61 12.3 Các định nghĩa CSS 61 12.4 Các thuộc tính .64 12.4.1 Thuộc tính kích thước 64 12.4.2 Thuộc tính lề 64 12.4.3 Thuộc tính khung viền 64 12.4.4 Thuộc tính bố cục 65 12.4.5 Thuộc tính danh sách .65 12.4.6 Thuộc tính bảng .66 12.4.7 Thuộc tính màu sắc 66 12.4.8 Thuộc tính định dạng kí tự - văn .66 12.4.9 Thuộc tính giao diện người dùng 67 12.4.10 Thuộc tính phân trang .67 12.4.11 Thuộc tính giàng riêng cho FireFox 67 12.4.12 Thuộc tính giàng riêng cho IE 67 12.5 Mô hình định dạng phần tử CSS 67 12.5.1 Mô hình hộp (box) 67 12.5.2 Margin Collapsing (thu hẹp lề) 68 12.5.3 Thiết lập vị trí 69 12.5.4 Thiết lập hộp (float box) 70 12.6 Sử dụng hình ảnh 71 12.6.1 Sử dụng ảnh 71 12.6.2 Box viền bo tròn góc cố định kích thước .72 12.6.3 Box viền bo tròn góc có chiều cao thay đổi 72 12.6.4 Box viền bo tròn góc có chiều rộng cao thay đổi .73 12.6.5 Tạo bóng cho khung ảnh 74 12.6.6 Tạo liên kết với kĩ thuật rollover 75 12.6.7 Tạo liên kết với kĩ thuật pixy 75 12.6.8 Tạo menu dọc với kĩ thuật pixy 76 12.6.9 Tạo menu ngang 77 12.6.10 Layout cột 78 12.6.11 Layout cột 80 12.6.12 Layout cột với kĩ thuật Faux 81 Giáo trình HTML TỔNG QUAN VỀ THIẾT KẾ WEB Bài Các khái niệm bản: 1.1 1.1.1 Web Tĩnh Thường xây dựng ngôn ngữ HTML, DHTML dùng để thiết kế trang web có nội dung cần thay đổi cập nhật Thích hợp với cá nhân, tổ chức, doanh nghiệp vừa nhỏ làm quen với môi trường Internet o o Ưu điểm:  Thiết kế đồ hoạ đẹp: Trình bày ấn tượng phần mỹ thuật hoàn toàn tự trình bày ý tưởng toàn diện tích trang  Tốc độ truy cập nhanh không thời gian việc truy vấn sở liệu trang web động  Chi phí đầu tư thấp: Chi phí xây dựng website tĩnh thấp nhiều so với website động xây dựng sở liệu, lập trình chi phí cho việc thuê Hosting Nhược điểm bản:  Khó khăn việc thay đổi cập nhật thông tin: Muốn thay đổi cập nhật nội dung thông tin phải biết ngôn ngữ html, sử dụng chương trình thiết kế đồ hoạ, thiết kế web, cập nhật file lên server  Thông tin tính linh hoạt: Do nội dung trang web tĩnh thiết kế cố định nên nhu cầu thông tin người truy cập tăng cao thông tin website tĩnh không đáp ứng  Khó tích hợp, nâng cấp, mở rộng: Khi muốn mở rộng, nâng cấp website tĩnh phải làm lại website 1.1.2 Web Động Web động thuật ngữ dùng để website có sở liệu hỗ trợ phần mềm phát triển web o Với web động, thông tin hiển thị gọi từ sở liệu người dùng truy vấn tới trang web Chẳng hạn ứng dụng thương mại điện tử (một cửa hàng trực tuyến) trưng bày catalogue sản phẩm website hay theo dõi kho hàng, mặt hàng giao, trang có liên quan đến sản phẩm phản ánh thay đổi o Web động thường phát triển ngôn ngữ lập trình tiên tiến PHP, ASP, ASP.NET, Java, CGI, Perl, sử dụng sở liệu quan hệ mạnh Access, My SQL, MS SQL, Oracle… Biên soạn Nguyễn Minh Thành Giáo trình HTML o Thông tin web động luôn dễ dàng thường xuyên cập nhật thông qua việc sử dụng công cụ cập nhật phần mềm quản trị web Thông tin cập nhật sở liệu người dùng Internet xem chỉnh sửa Vì website hỗ trợ sở liệu phương tiện trao đổi thông tin nhanh với người dùng Internet Điều dễ nhận thấy website thường xuyên cập nhật thu hút nhiều khách hàng tới thăm o Tất website Thương mại điện tử, mạng thông tin lớn, website tổ chức, doanh nghiệp hoạt động chuyên nghiệp Net sử dụng công nghệ web động Có thể nói web động website giới chuyên nghiệp hoạt động môi trường Internet 1.1.3 Mạng Internet Mạng máy tính toàn cầu – Hệ thống mạng mạng Tiền thân ban đầu mạng ARPANET(Tổ chức Advanced Research Projects Agency) Mỹ sáng lập 1969 Phục vụ trao đổi liệu trường đại học & Bộ quốc phòng 1.1.4 Các dịch vụ Internet  WWW-Wold Wide Web: Dịch vụ trao đổi,tìm kiếm truy cập thông tin mạng theo giao thức HTTP Được sử dụng thông qua trình duyệt Web  Email – Eletronic Mail-Thư điện tử: Dịch vụ trao đổi thông điệp cho SMTP(Smple mail tranfer protocol) Pop3 (Post office protocol 3) quản lý Mail server như: phetcm@yahoo.com , webmaster@clbtinhoc.net , phet@hcm.fpt.vn  FTP – File transferprotocol – Truyền tải tập tin : Dịch vụ trao đổi tập tin máy Internet thường dùng để Download & Upload trang web từ người thiết máy chủ thông qua chương trình FTP FTP Explorer, FlashFXP  Chat –Tán : Dịch vụ cho phép người dùng trao đổi trực tuyến với qua mạng internet văn bản, âm thanh, hìinh ảnh.Như : AOL, Yahoo messenger 1.1.5 HTTP – Hyper Text Transfer Protocol Giao thức dùng để giao tiếp với trang Web 1.1.6 HTML – Hyper Text Markup Language Ngôn ngữ đánh dấu siêu văn dùng để thiết kế trang Web 1.1.7 Webpage – trang web Là tập tin văn soạn thảo theo ngôn ngữ HTML có phần mở rộng HTML HTM Biên soạn Nguyễn Minh Thành Giáo trình HTML 1.1.8 Website Chuyên khu Web tập hợp trang web thuộc chủ đề 1.1.9 Homepage Trang đầu tiên-Trang chủ Website(Index.html, Index.htm, Default.htm ) 1.1.10 Web Server Máy chủ web-Máy tính cấu hình mạnh, lưu trữ trang Web kết nối thường xuyên với mạng cho phép máy khác truy cập thông tin.Tên miền – Domain Name – Web Server Name Để phân biệt Web Server có địa IP ánh xạ tên (VD:www.vietnamnet.vn) Được xem tên giao dịch công ty, tổ chức Internet Tên miền cấp 1: Bao gồm mã quốc gia :Việt Nam: VN, Anh: UK, Mỹ: US, Nhật:.JP ) số lĩnh vực .com : Thương mại edu : Tổ chức giáo dục net : Các mạng thông tin info : Các mạng thông tin int : Tổ chức quốc tế org : Các tổ chức khác gov : Tổ chức phủ mil : Tổ chức quân Tên miền cấp 2: Có thể kết hợp lĩnh vực với mã quốc gia để hình thành tên miền cấp www.tuoitre.com.vn Để sở hữu tên miền phải trả chi phí hàng năm thông qua công ty ủy quyền bán tên miền 1.1.12 Hosting Khi hoàn tất website phải ghi lưu vào webserver truy cập thông thường server cùa ISP (Nhà cung cấp dịch vụ Internet hay đơn vị chuyên dụng) Tùy theo dung lượng, băng thông số hỗ trợ mà chi phí khác Biên soạn Nguyễn Minh Thành Giáo trình HTML 1.1.13 URL – Uniform Resource Location Địa truy cập trang Web, tập tin Website http://Webservername/……/File.html Trang chủ mặc định không cần khai báo VD: http://www.tuoitre.com.vn Tức là: http://www.tuoitre.com.vn/Index.htm 1.1.14 Browser Trình duyệt Web dùng để đọc hiển thị trang Web Phổ biến: InternetExplorer,Netscape,FireFox 1.2 Soạn Thảo Trang Web 1.2.1 Chương trình soạn thảo Trang web tập tin văn không định dạng, chứa thẻ (Tag) Viết mã nguồn HTML chương trình soạn thảo văn không định dạng như: NotePad Ngoài ra, ngày có nhiều phần mềm hỗ trợ thiết kế web, cho phép người thiết kế vừa thiết kế mã HTML, vừa thiết kế với giao diện đồ họa : Microsoft Word, MS FrontPage, Dreamwaver, Visual Studio… Khởi động : Start/Program/Accessories/NotePad Ghi chú: Nếu sử dụng chữ có dấu, phải  Thiết lập bảng mã Unicode cho trình gõ VietKey, Unikey,  Chọn Font Unicode trình soạn thảo (Format / Font  Arial , Tahoma, ) 1.2.2 Đặt tên, lưu & mở tập tin Tập tin lưu trữ có phần mở rộng là: htm html Biên soạn Nguyễn Minh Thành 10 Giáo trình HTML     vertical-align : {length | percentage | baseline | bottom | middle | sub | super | text-bottom | text-top | top | inherit} white-space : {normal | nowrap | pre | pre-line | pre-wrap | inherit} direction : {ltr | trl | inherit} unicode-bidi : {bidi-override | embed | normal | inherit} 12.4.9 Thuộc tính giao diện người dùng  cursor : {[uri] | auto | crosshair | default | e-resize | help | move | n-resize | ne-resize | nw-resize | pointer | progress | s-resize | se-resize | sw-resize | text | w-resize | wait | inherit} 12.4.10 Thuộc tính phân trang   page-break-before : {always | auto | avoid | left | right | inherit} page-break-after : {always | auto | avoid | left | right | inherit} 12.4.11 Thuộc tính giàng riêng cho FireFox   -moz-border-radius : {length | percentage | inherit} -moz-box-sizing : {content-box | border-box | padding-box} 12.4.12 Thuộc tính giàng riêng cho IE    12.5 zoom : {number | percentage | normal} filter : {filter} behaviour : uri Mô hình định dạng phần tử CSS 12.5.1 Mô hình hộp (box) Các phần tử HTML thể web theo mô hình hộp (box) Mô hình hộp phần tử bao gồm : content (nội dung), padding, border, margin Mô hình hộp CSS Biên soạn Nguyễn Minh Thành 67 Giáo trình HTML Kích thước phần nội dung xác định thuộc tính width, cộng thêm kích thước padding, border margin tổng kích thước box Vd : class định nghĩa sau : #myBox { margin: 10px; padding: 5px; width: 70px; } 12.5.2 Margin Collapsing (thu hẹp lề) Khi phần tử nằm phần tử khác, lề phần tử bị hẹp Khi phần tử chứa phần tử khác, border hay padding phân cách, lề trên/dưới phần tử bị thu hẹp Biên soạn Nguyễn Minh Thành 68 Giáo trình HTML Khi phần tử không chứa nội dung (phần tử trống), padding hay border, lề phần tử bị thu hẹp, lai lề Tương tự, hai phần tử trống nằm gần nhau, lại lề phần tử Tổng quát, phần tử thu hẹp lề xếp gần sau : 12.5.3 Thiết lập vị trí Thiết lập vị trí tương đối : box thiết lập vị trí tương đối (relative) có vị trí tính toán theo box xung quanh #myBox { position: relative; left: 20px; top: 20px; Biên soạn Nguyễn Minh Thành 69 Giáo trình HTML } Thiết lập vị trí tuyệt đối : box thiết lập vị trí tuyệt đối (absolute) có vị trí tính toán tuyệt đối dựa vào trình duyệt Thiết lập vị trí cố định : box thiết lập vị trí cố định (fixed) có vị trí xuất hình với vị trí xác định Một ví dụ vị trí cố định (fixed positioning) 12.5.4 Thiết lập hộp (float box) Các box không thiết lập chế độ float xuất lên trang web từ xuống Tuy nhiên, thiết lập chế độ float, box thể lên phần tử không thiết lập đẩy phần tử qua trái qua phải Biên soạn Nguyễn Minh Thành 70 Giáo trình HTML Box đẩy qua phải box đẩy qua trái đè lên box Tất box đẩy qua trái Các box đẩy qua trái chiều dài không đủ kích thước với độ cao khác 12.6 Sử dụng hình ảnh 12.6.1 Sử dụng ảnh Sử dụng ảnh cho trang web : body { background: #ccc url(gradient.gif) repeat-x; } Biên soạn Nguyễn Minh Thành 71 Giáo trình HTML Sử dụng ảnh bullet h1 { padding-left: 30px; background: url(/images/bullet.gif) no-repeat left center; } 12.6.2 Box viền bo tròn góc cố định kích thước Sử dụng ảnh sau : Các class thiết lập : box { width: 418px; background: #effce7 url(images/bottom.gif) no-repeat left bottom; /* màu box trùng với màu ảnh */ } box h2 { background: url(images/top.gif) no-repeat left top; } Code sử dụng : Headline Content 12.6.3 Box viền bo tròn góc có chiều cao thay đổi Sử dụng ảnh sau : Các class thiết lập : box { width: 424px; background: url(images/bg-tile.gif) repeat-y; } Biên soạn Nguyễn Minh Thành 72 Giáo trình HTML box h2 { background: url(images/bg-top.gif) no-repeat left top; padding-top: 20px; } box last { background: url(images/bg-bottom.gif) no-repeat left bottom; padding-bottom: 20px; } box h2, box p { padding-left: 20px; padding-right: 20px; } Code sử dụng : Headline Content 12.6.4 Box viền bo tròn góc có chiều rộng cao thay đổi Sử dụng ảnh sau : Các class thiết lập box2 { width: 50em; background: #e4dede url(images/bottom_left.gif) no-repeat left bottom; /* màu màu ảnh bottom-left */ } box2-outer { background: url(images/bottom_right.gif) no-repeat right bottom; padding-bottom: 5%; } box2-inner { background: url(images/top_left.gif) no-repeat left top; } box2 h2 { Biên soạn Nguyễn Minh Thành 73 Giáo trình HTML background: url(images/top_right.gif) no-repeat right top; padding-top: 5%; } box2 h2, box2 p { padding-left: 5%; padding-right: 5%; } Code sử dụng : Headline Content 12.6.5 Tạo bóng cho khung ảnh Sử dụng ảnh bóng kích thước 800x800 : Các class thiết lập : img-wrapper { background: url(images/shadow.gif) no-repeat bottom right; clear: right; float: left; position: relative; } img-wrapper img { background-color: #fff; border: 1px solid #a9a9a9; padding: 4px; display: block; margin: -5px 5px 5px -5px; Biên soạn Nguyễn Minh Thành 74 Giáo trình HTML position: relative; } Code sử dụng: 12.6.6 Tạo liên kết với kĩ thuật rollover Sử dụng ảnh cho link (với kích thước 200x40) : Các class sử dụng : a:link, a:visited { display: block; width: 200px; height: 40px; line-height: 40px; color: #000; text-decoration: none; background: #94B8E9 url(images/button.gif) no-repeat left top; text-indent: 50px; } a:hover { background: #369 url(images/button-hover.gif) no-repeat left top; color: #fff; } 12.6.7 Tạo liên kết với kĩ thuật pixy Sử dụng ảnh liên kết sau (kích thước 400x40): Các class thiết lập : a.pixy:link, a.pixy:visited { display: block; Biên soạn Nguyễn Minh Thành 75 Giáo trình HTML width: 200px; height: 40px; line-height: 40px; color: #000; text-decoration: none; background: #94B8E9 url(images/pixy.gif) no-repeat left top; text-indent: 50px; } a.pixy:hover { background-color: #369; background-position: right top; color: #fff; } Code sử dụng : Test link style 12.6.8 Tạo menu dọc với kĩ thuật pixy Sử dụng ảnh kĩ thuật pixy Các class thiết lập : ul.ver{ list-style:none; } ul.ver a { display: block; width: 200px; height: 39px; line-height: 39px; color: #000; text-decoration: none; background: #94B8E9 url(images/pixy-navigate.gif) no-repeat left top; text-indent: 50px; } ul.ver li.first a { height: 40px; line-height: 40px; } ul.ver a:hover, selected a { background-position: right top; color: #fff; } Biên soạn Nguyễn Minh Thành 76 Giáo trình HTML Code sử dụng : Home About Our Services Our Work News Contact Kết : 12.6.9 Tạo menu ngang Sử dụng ảnh nhỏ (6x25) : Và ảnh làm dấu phân cách (2x25): Các class thiết lập : ul.horizon { margin: 0; padding: 0; list-style: none; width: 700px; float: left; background: #FAA819 url(images/nav_bar.gif) repeat-x; } ul.horizon a { display: block; float: left; Biên soạn Nguyễn Minh Thành 77 Giáo trình HTML padding: 1.5em; line-height: 29px; background: url(images/nav_bar_divider.gif) no-repeat right top; text-decoration: none; color: #fff; } ul.horizon li.first a { background: none; } ul.horizon a:hover { color: #333; } Code sử dụng : Home About Our Services Our Work News Contact Kết : 12.6.10 Layout cột Mô hình : Biên soạn Nguyễn Minh Thành 78 Giáo trình HTML Code CSS : #wrapper{ width:720px; margin: auto; } #wrapper { width: 720px; position: relative; left: 50%; margin: 0 -360px; } #content { width: 520px; float: right; } #mainNav { width: 180px; float: left; padding-top: 20px; padding-bottom: 20px; } #mainNav li { padding-left: 20px; padding-right: 20px; } #footer { clear: both; } #content h1, #content h2, #content p { padding-right: 20px; } Code sử dụng : Biên soạn Nguyễn Minh Thành 79 Giáo trình HTML Kết 12.6.11 Layout cột Mô hình : Code CSS thêm vào #mainContent { width: 320px; float: left; } #secondaryContent { width: 180px; float: right; Biên soạn Nguyễn Minh Thành 80 Giáo trình HTML } #secondaryContent h1, #secondaryContent h2, #secondaryContent p { padding-left: 20px; padding-right: 20px; } Kết : 12.6.12 Layout cột với kĩ thuật Faux Sử dụng ảnh cột : Code CSS : #wrapper { background: #fff url(images/nav-bg.gif) repeat-y left top; } Kết : Biên soạn Nguyễn Minh Thành 81 [...]... trang web Phần tử này cung cấp cho trình duyệt web biết thông tin về loại (hay phiên bản) ngôn ngữ đánh dấu được viết trong trong web đó, điều này có thể có hoặc không có ảnh hưởng gì đến việc thể hiện nội dung của trang web Nếu bạn sử dụng trình biên soạn web của hãng WYSIWYG, thì các trình biên soạn của hãng này sẽ tự động tạo Biên soạn Nguyễn Minh Thành 12 Giáo trình HTML ra phần tử doctype và cho... trữ  Double Click tập tin htm Cách 2: Khởi động trình duyệt (IE)  File/Open Chọn Browser để tìm tập tin cần mở  Ok  Kết quả hiện thị Biên soạn Nguyễn Minh Thành 11 Giáo trình HTML Bài 2 2.1 GIỚI THIỆU VỀ HTML - XHML Định nghĩa về HTML HTML là một bộ các mã lệnh logic (mã lệnh đánh dấu) được đặt trong các đấu ngoặc(< >), các mã lệnh này cấu tạo nên sự trình bày một văn bản web và các thông tin chứa... không sử dụng trình biên soạn của hãng WYSIWYG, bạn có thể tham khảo danh sách các loại doctype được trình bày bại …… Phần tử doctype được trình bày trong trang web theo mẫu sau: Page title Trong ví dụ trên, doctype chỉ định loại văn bản được trình bày... silver birch. Văn bản được xuất lên trình duyệt :  Thuộc tính : - cite : chỉ định địa chỉ nguồn của đoạn văn được trích dẫn Tuy nhiên thuộc tính này thường ít được sử dụng Biên soạn Nguyễn Minh Thành 27 Giáo trình HTML 4.6 br  Chức năng : - Phần tử br được dùng để tạo ra một ngắt xuống dòng vd : Văn bản được thể hiện trong trình duyệt :  Thuộc tính : - clear : dùng để xóa các... MIME(tương tự script) Type = "MIME type" Biên soạn Nguyễn Minh Thành 23 Giáo trình HTML Các giá trị thường dùng :  Text/css : chỉ định kiểu gói tin là là các văn bản thô chứa mã css 3.7 title …  Chức năng : - Phần tử title dùng để định nghĩa tiêu đề cho trang web, tiêu đề này sẽ xuất hiện trên thanh tiêu đề của trình duyệt web, hoặc trong mục favourite khi trang web được lưu lại vd... phần tử thiết kế nội dung cho trang web được trình bày bên trong phần tử này vd : 101 Ways to make a paper aeroplane Let's start with the basics … ⋮  Thuộc tính : - marginheight : thiết lập khoảng cách trên và dưới của văn bản với cửa sổ trình duyệt - marginwidth : thiết lập khoảng cách trái và phải của văn bản với cửa sổ trình duyệt - topmargin / bottommargin : thiết... Biên soạn Nguyễn Minh Thành 15 Giáo trình HTML chứa các thông tin được định nghĩa bằng CSS Chứa các phần tử HTML để miêu tả nội dung cho trang web 2.2.3 Thiết lập thuộc tính cho phần tử Mỗi phần tử HTML đều có các thuộc tính để thay đổi cách thể hiện của nó trên trang web, để thiết lập thuộc tính cho một phần tử (như đã trình bày trong phần giới thiệu),... : - clear : dùng để xóa các canh lề trước đó, và cho nội dung bên dưới phần tử br nằm dưới phần tử được canh lề trước đó Các giá trị : all, left, right, none vd : Thể hiện trên trình duyệt Biên soạn Nguyễn Minh Thành 28 Giáo trình HTML 4.7 hr  Chức năng : - Phần tử hr tạo ra một ngắt xuống dòng và thể hiện một đường kẻ ngang ngay vi trị ngắt  Thuộc tính : - color : thiết lập màu cho đường kẻ... các đoạn văn bản trích dẫn mã lệnh lập trình 5.19 var …  Chức năng : - Tạo các đoạn văn bản trích dẫn các biến dữ liệu, các giá trị 5.20 plaintext …  Chức năng : - Văn bản được hiển thị bỏ qua tất cả các định dạng trong HTML 5.21 comment …  Chức năng : Biên soạn Nguyễn Minh Thành 34 Giáo trình HTML - Tạo các đoạn văn bản chú thích... tính chất là một định nghĩa (đoạn văn bản được in nghiêng) 5.27 kbd … Biên soạn Nguyễn Minh Thành 35 Giáo trình HTML  Chức năng : - Tạo một đoạn văn bản kiểu đánh máy chữ 5.28 pre …  Chức năng : - Giữ các khoảng trắng quan trọng trong đoạn văn bản (mặc định trình duyêt chỉ thể hiện khoảng trắng đầu tiên) 5.29 marquee ... trình HTML 2.2.4 Sự khác HTML XHTML XHTML bổ sung đầy đủ cho HTML với nhiều tùy chọn tốt cho việc thể Tuy nhiên, có nhiều ngưởi sử dụng ngôn ngữ HTML (mới HTML 5) cho HTML dễ sử dụng XHTML Vì... kế :  XHTML khó HTML, XHTML có nhiều phần tử ngôn ngữ HTML (nếu sử dụng HTML trở xuống) Và XHTML, phần tử bắt buộc phải có thẻ mở thẻ đóng Ví dụ :

văn XHTML

, HTML cần

văn HTML (ko... "http://www.w3.org/TR/xhtml1/DTD/ xhtml1-transitional.dtd">