Giáo trình hướng dẫn giảng dạy chương trình kỹ thuật viên - Học phần 3: Lập trình ứng dụng web với ASP.NET

Giáo trình hướng dẫn người học cách cài đặt và cấu hình Web Server; giúp học viên có thể thiết kế, xây dựng, phát triển ứng dụng web với Asp.Net. Nội dung tài liệu gồm có 6 bài học về: Tổng quan về Asp.Net, Asp Server Control, các điều khiển liên kết dữ liệu, xây dựng lớp xử lý dữ liệu, xây dựng các đối tượng thể hiện, xây dựng và quản lý ứng dụng web, Web Services. Mời các bạn cùng tham khảo để biết thêm các nội dung chi tiết.

TRUNG TÂM TIN HỌC – ĐẠI HỌC KHOA HỌC TỰ NHIÊN TP.HCM 227 Nguyễn Văn Cừ - Quận 5- Tp.Hồ Chí Minh Tel: 8351056 – Fax 8324466 – Email: ttth@hcmuns.edu.vn TÀI LIỆU HƯỚNG DẪN GIẢNG DẠY CHƯƠNG TRÌNH KỸ THUẬT VIÊN Học phần LẬP TRÌNH ỨNG DỤNG WEB VỚI ASP.NET Mã tài liệu: DT_NCM_LT_TLGD_ASP.NET Phiên 1.0 – Tháng 06/05 Tài liệu hướng dẫn giảng dạy MỤC LỤC GIỚI THIỆU GIÁO TRÌNH LÝ THUYẾT TÀI LIỆU THAM KHẢO Bài TỔNG QUAN VỀ ASP.NET I Tổng quan lập trình ứng dụng Web I.1 HTTP HTML - Nền móng Kỹ thuật lập trình web I.2 Tìm hiểu mơ hình ứng dụng .10 II Giới thiệu ASP.Net 12 II.1 Tìm hiểu Net Phatform .12 II.2 Tìm hiểu Net Framework 12 II.3 Tìm hiểu ASP.Net .16 II.4 Những ưu điểm ASP.Net 16 II.5 Quá trình xử lý tập tin ASPX 17 III Web Server 18 III.1 Internet Information Services .18 III.2 Cài đặt Web Server .19 III.3 Cấu hình Internet Information Services 22 III.4 Tạo ứng dụng web IIS 23 IV Tạo ứng dụng Web 24 IV.1 Khởi động MS Visual Studio Net 24 IV.2 Tạo ứng dụng Web .25 IV.3 Phân loại tập tin ASP.Net 27 IV.4 Làm quen với thành phần giao diện VS Net .28 Bài 32 WEB SERVER CONTROL 32 I HTML Control 33 Học phần - Lập trình ứng dụng web với ASP.NET Trang 1/174 Tài liệu hướng dẫn giảng dạy II ASP.Net Web Control 35 II.1 Asp.Net Page 35 II.2 Điều khiển 36 II.3 Điều khiển kiểm tra liệu 46 II.4 Một số điều khiển khác 53 II.5 Đối tượng ViewState .59 Bài 61 CÁC ĐIỀU KHIỂN LIÊN KẾT DỮ LIỆU 61 I Điều khiển DataGrid 62 I.1 Các thao tác định dạng lưới 62 I.2 Xử lý xếp 67 I.3 Xử lý phân trang 69 I.4 Tùy biến cột 70 I.5 Cập nhật liệu trực tiếp lưới .74 II Điều khiển DataList 79 II.1 Sử dụng DataList để hiển thị liệu .79 II.2 Cập nhật liệu với DataList 83 III Điều khiển Repeater 87 IV Các ví dụ mở rộng 90 IV.1 Xử lý đảo hướng xếp DataGrid 90 IV.2 Tạo biểu tượng xếp cột cho DataGrid .91 IV.3 Định dạng hình thức hiển thị cho dòng liệu thỏa điều kiện DataGrid 92 IV.4 Tạo hiệu ứng chọn rê chuột qua dòng liệu 93 Bài 94 XÂY DỰNG LỚP XỬ LÝ DỮ LIỆU 94 I Thiết kế tổng quan 96 I.1 Cấu trúc chi tiết lớp XL_BANG 98 I.2 Xây dựng lớp xử lý nghiệp vụ 102 I.3 Sử dụng lớp xử lý nghiệp vụ 104 Bài 108 Học phần - Lập trình ứng dụng web với ASP.NET Trang 2/174 Tài liệu hướng dẫn giảng dạy XÂY DỰNG ĐỐI TƯỢNG THỂ HIỆN 108 I Tạo đối tượng thể 109 II Sử dụng đối tượng thể 111 III Tạo phương thức cho đối tượng thể 112 IV Tạo kiện cho đối tượng thể 113 IV.1 Thiết kế 114 IV.2 Xử lý 114 Bài 117 XÂY DỰNG VÀ QUẢN LÝ ỨNG DỤNG 117 I Đối tượng Request, Response 118 I.1 Đối tượng Response 118 I.2 Đối tượng Request 120 II Đối tượng Session, Application 122 II.1 Đối tượng Application 123 II.2 Đối tượng Session 124 III Đối tượng Server 125 IV Đối tượng Cookies 125 IV.1 Giới thiệu 125 IV.2 Làm việc với Cookies 126 V Tập tin quản lý cấu hình ứng dụng 127 V.1 Global.asax 127 V.2 Web.config 128 VI Tổ chức & xây dựng ứng dụng 133 VI.1 Tổ chức lưu trữ ứng dụng 133 VI.2 Xây dựng ứng dụng 134 Bài 136 WEB SERVICE 136 I Tìm hiểu Web Services 137 II Xây dựng Web Services 140 Học phần - Lập trình ứng dụng web với ASP.NET Trang 3/174 Tài liệu hướng dẫn giảng dạy II.1 Tạo Web Services VS Net 140 II.2 Kiểm tra Web Service 141 III Sử dụng Web Service 143 III.1 Sử dụng Web Service người dùng xây dựng 144 III.2 Sử dụng Web Services cung cấp miễn phí mạng 144 IV Xây dựng Web Services truy xuất liệu 148 IV.1 Web Service: WS_KHACH_HANG 148 IV.2 Sử dụng WS_KHACH_HANG 150 Bài 152 PHỤ LỤC 152 I Cơ sở liệu dùng ứng dụng 153 I.1 Thiết kế sở liệu 153 I.2 Dữ liệu thử 156 II Giới thiệu tag HTML 157 II.1 Cơ tag HTML 157 II.2 Các tag nhập liệu 163 III Cascading Style Sheets - CSS 166 III.1 Giới thiệu CSS 166 III.2 Cú pháp CSS 167 III.3 Sử dụng CSS trang HTML 169 Học phần - Lập trình ứng dụng web với ASP.NET Trang 4/174 Tài liệu hướng dẫn giảng dạy GIỚI THIỆU Sau hồn thành khóa học này, học viên có khả năng: ƒ Cài đặt cấu hình Web Server ƒ Thiết kế, xây dựng, phát triển ứng dụng web với Asp.Net Với thời lượng 36 tiết LT 60 tiết TH phân bổ sau: STT Bài học Số tiết LT Số tiết TH Tổng quan Asp.Net Asp Server Control 10 Các điều khiển liên kết liệu 10 Xây dựng lớp xử lý liệu 5 Xây dựng đối tượng thể 10 Xây dựng quản lý ứng dụng web 15 Web Services 36 60 Tổng số tiết: Học phần - Lập trình ứng dụng web với ASP.NET Trang 5/174 Tài liệu hướng dẫn giảng dạy GIÁO TRÌNH LÝ THUYẾT TÀI LIỆU THAM KHẢO Trong trình biên soạn tài liệu hướng dẫn giảng dạy giáo trình, chúng tơi có tham khảo số tài liệu sau: MSDN Library - April 2003 & MSDN Library - July 2005 MSDN Traning: Developing Microsoft ASP.NET Web Applications Using Visual Studio.NET MSDN Traning: Programming with Microsoft ADO.NET ASP.NET Web Developer’s Guide ASP.NET By Example [Steven A Smith] Developing Web Applications with Visual Basic NET and ASP.NET [John Alexander, Billy Hollis] Programming ASP.NET, 2nd Edition [Dan Hurwitz, Jesse Liberty] Inside ASP.NET [Scott Worley] ASP NET Bible [Mridula Parihar] 10 ASP.NET for Web Designers [Peter Ladka] 11 Professional ADO.NET Programming [Wrox] 12 Cascading Style Sheets - The Designer's Edge [Molly E Holzschlag ] 13 JavaScript Bible - Gold Edition [Danny Goodman] 14 Real World Web Services [Yasser Shohoud] 15 Trang chủ ASP.Net: http://www.asp.net 16 Trường học trực tuyến W3C: http://www.w3schools.com Học phần - Lập trình ứng dụng web với ASP.NET Trang 6/174 Tài liệu hướng dẫn giảng dạy HƯỚNG DẪN PHẦN LÝ THUYẾT Bài TỔNG QUAN VỀ ASP.NET Tóm tắt Lý thuyết tiết - Thực hành tiết Mục tiêu Các mục Tìm hiểu kỹ thuật lập trình ứng Tổng quan lập trình ứng dụng web dụng web mơ hình ứng dụng Cài đặt cấu hình Web Server Giới thiệu Asp.Net Web Server Tìm hiểu mơi trường phát triển ứng Tạo ứng dụng web dụng web với Visual Studio.Net Học phần - Lập trình ứng dụng web với ASP.NET Bài tập 1.1, 1.2, 1.3, 1.4, 1.6, 1.7 Bài làm thêm: 1.5 Trang 7/174 Tài liệu hướng dẫn giảng dạy I Tổng quan lập trình ứng dụng Web Ứng dụng Web hệ thống phức tạp, dựa nhiều yếu tố: phần cứng, phần mềm, giao thức, ngôn ngữ thành phần giao diện Trong phần này, giới thiệu sơ lược cho bạn thành phần ứng dụng Web: HTTP (giao thức trao đổi tài nguyên) HTML (ngôn ngữ xây dựng trang web) I.1 HTTP HTML - Nền móng Kỹ thuật lập trình web I.1.1 HTTP (Hypertext Transfer Protocol) Kỹ thuật lập trình ứng dụng web khởi đầu HyperText Transfer Protocol (HTTP), giao thức cho phép máy tính trao đổi thơng tin với qua mạng máy tính HTTP xác định qua URLs (Uniform Resource Locators), với cấu trúc chuỗi có định dạng sau: http: // [: ] [ [? ]] Sau tiền tố http://, chuỗi URL chứa tên host hay địa IP máy server (có thể có số cổng kèm), đường dẫn dẫn đến tập tin server yêu cầu Tùy chọn sau tham số, gọi query string (chuỗi tham số/chuỗi truy vấn) Ví dụ: Phân tích địa http://www.comersus.com/comersus6/store/index.asp Trang web index.asp lưu trữ thư mục /comersus6/store Web Server với host www.comersus.com Một số thuật ngữ: ƒ Internet: hệ thống gồm nhiều máy tính khắp nơi giới nối lại với ƒ WWW: World Wide Web (mạng toàn cầu), thường dùng nói Internet ƒ Web Server: Máy tính lưu trữ trang web ƒ Web Client: Máy tính dùng để truy cập trang web ƒ Web Browser: Phần mềm dùng để truy cập web Một số web browser phổ biến: Internet Explorer, Netscape Navigator, Avant Browser, Opera, … Học phần - Lập trình ứng dụng web với ASP.NET Trang 8/174 Tài liệu hướng dẫn giảng dạy I.1.2 HTML (Hypertext Markup Language) Trang web HTML tập tin văn viết ngôn ngữ HTML, ngơn ngữ cịn biết đến với tên gọi: ngôn ngữ đánh dấu văn Ngôn ngữ đánh dấu HTML sử dụng ký hiệu quy định sẵn (được gọi tag) để trình bày nội dung văn Nội dung Định dạng Trang chủ Windows Server System Microsoft …… Kết hiển thị Ví dụ: Nội dung trang web AspDotNet.htm ASP.Net

Chào bạn đến với ASP.Net!!!

Ghi chú: Các bạn đọc thêm tag HTML phần Phụ lục B Học phần - Lập trình ứng dụng web với ASP.NET Trang 9/174 Tài liệu hướng dẫn giảng dạy b Liên kết trang web Nếu cho bạn quyền đặt tên cho tag HTML, có lẽ bạn thay (Link) Tuy nhiên thực mang ý nghĩa mỏ neo (anchor) bạn dùng để liên kết tới đoạn văn thân trang web Thuộc tính name dùng để đặt tên cho đoạn văn liên kết tới Chú ý, giá trị name có dấu # đứng trước Ví dụ: Đến cuối trang ……… cuối trang c Liên kết với địa email Để cho phép người đọc gửi mail cho bạn cách click vào liên kết, gán giá trị "mailto:địa email" cho thuộc tính href II.1.4 Danh sách (List) Danh sách gồm loại: có thứ tự khơng có thứ tự Danh sách HTML tương tư định dạng Bullets and Numbering Word Thơng thường, phân biệt danh sách có thứ tự khơng có thứ tự Với danh sách có thứ tự, mục đánh thứ tự 1, 2, hay a, b, c, … với danh sách khơng có thứ tự, mục bắt đầu dấu –, ƒ , à, {,… Trong HTML, mục danh sách bắt đầu tag

Các mục danh sách lại đặt tag danh sách HTML có tag danh sách:

: ordered list – danh sách có thứ tự
: unordered list – danh sách khơng có thứ tự Ví dụ: Nội dung mơn học lập trình web
1. HTML
2. JavaScript
Kết quả: Nội dung môn học lập trình web HTML JavaScript Ví dụ: Nội dung mơn học lập trình web
• HTML
Học phần - Lập trình ứng dụng web với ASP.NET Trang 160/174 Tài liệu hướng dẫn giảng dạy
• JavaScript
Kết quả: Nội dung môn học lập trình web • • HTML JavaScript Thuộc tính type tag danh sách cho phép bạn định lại số thứ tự hay bullet hiển thị đầu mục danh sách Các giá trị type: "A" "a" "I" "i" "1" : : : : :
- Order list A, B, C, … a, b, c, … I, II, III,… i, ii, iii, … 1, 2, 3, … (mặc định)
- Unorder list "disk" : z "circle" : { "square" : ƒ II.1.5 Hình ảnh (Image) HTML phiên khơng hỗ trợ việc đưa hình ảnh vào trang web HTML cho phép bạn đưa vào trang web khơng hình ảnh mà file "nhúng" video, âm Nên sử dụng định dạng file thông dụng mà web browser hỗ trợ GIF, JPEG, BMP, PNG a Đưa hình ảnh vào trang web HTML sử dụng tag (image) để hiển thị hình ảnh Thuộc tính quan trọng src (source) có giá trị URL đường dần tới file hình ảnh muốn hiển thị Ví dụ: Yahoo! Kết quả: Yahoo! Chú ý: file hình ảnh bạn khơng nằm chung thư mục với file html bạn phải đường dẫn tới file b Thuộc tính atl Trong trường hợp hình ảnh khơng hiển thị khơng tìm thấy file hay web browser không nhận file từ phía web server, sử dụng thuộc tính alt (alternate) với giá trị nội dung mơ tả tóm tắt hình ảnh muốn thể để người dùng dễ nhận biết Ví dụ: Yahoo! Kết quả: (khi khơng có file c:\yahoo.gif) Yahoo! Học phần - Lập trình ứng dụng web với ASP.NET Trang 161/174 Tài liệu hướng dẫn giảng dạy c Xác định chiều rộng chiều cao Để thay đổi chiều rộng chiều cao hình ảnh, sử dụng hai thuộc tính width height Giá trị width height thường dùng pixel (mặc định) % Ví dụ: Yahoo! Kết quả: Yahoo! II.1.6 Bảng (Table) a Cú pháp … … … … HTML sử dụng cấu trúc tag gồm có , để định dạng bảng: ƒ : phần nằm tag cấu trúc dòng cột bảng ƒ - Table Row: phần nằm tag cấu trúc cột dòng ƒ - Table Data: phần nằm tag nội dung cell (một cột dịng) Ví dụ: Cột dòng 1Cột dòng 1 Cột dòng 1 Cột dòng 2Cột dòng 2 Cột dòng 2 Kết quả: Cột dòng Cột dòng Cột dòng Cột dòng Cột dòng Cột dịng Học phần - Lập trình ứng dụng web với ASP.NET Trang 162/174 Tài liệu hướng dẫn giảng dạy b Width, CellSpacing CellPadding ƒ width: Định độ rộng table hay cột ƒ cellspacing: Định khoảng cách cell ƒ cellpadding: Định khoảng cách từ biên cell tới nội dung cell Nếu không định độ rộng cho table, web browser tự động chỉnh độ rộng table đủ chứa phần nội dung bên Tương tự, độ rộng cột tự động co giãn để thích hợp với nội dung chứa cột Chỉ định giá trị cho width giúp bạn kiểm sốt web browser trình bày trang web Giá trị width đo pixel hay % Thơng thường ta hay dùng % Ví dụ: Kết quả: II.2 Các tag nhập liệu II.2.1 Tag Hầu hết điều khiển tạo tag , cấu trúc tag sau: type : loại điều khiển muốn tạo Có loại điều khiển là: ƒ TextBox – "text" ƒ CheckBox – "checkbox" ƒ OptionBox – "radio" ƒ Button – "button" ƒ Submit/Reset – "submit"/"reset" name: Tên điều khiển Tương tự form bạn lập trình Windows, điều khiển nên có tên riêng biệt Riêng với trường hợp OptionBox, để gom nhiều option thành nhóm, OptionBox có giá trị thuộc tính name giống value: Chuỗi văn hiển thị điều khiển Với TextBox nội dung TextBox, với Button (kể Submit Reset) tiêu đề điều khiển Ví dụ: Học phần - Lập trình ứng dụng web với ASP.NET Trang 163/174 Tài liệu hướng dẫn giảng dạy Tên đăng nhập Mật khẩu   Tạo người dùng mới

Kết quả: Qua ví dụ trên, thấy bạn phép sử dụng tag định dạng để trình bày form ,

,… Chú ý: Với CheckBox OptionBox, thuộc tính checked dùng để đánh dấu chọn vào CheckBox hay OptionBox trang web hiển thị Thuộc tính size textbox dùng để định chiều rộng textbox, đơn vị size số ký tự Tuy nhiên, nội dung textbox không bị giới hạn size II.2.2 Vùng nhập liệu – tag Điều khiển TextBox mà bạn tạo tag có khả nhận vào dịng văn Để có TextBox cho phép nhập nhiều dòng bạn sử dụng tag Nội dung… Khác với tag , tag cần kết thúc Nội dung TextBox tạo khơng định giá trị thuộc tính value, thay vào đó, phần nội dung nằm cặp tag Thuộc tính cols tương tự thuộc tính size xác định Học phần - Lập trình ứng dụng web với ASP.NET Trang 164/174 Tài liệu hướng dẫn giảng dạy chiều rộng TextBox tính số ký tự Thuộc tính rows cho biết chiều cao TextBox Ví dụ:

Hello Kết quả: II.2.3 ComboBox ListBox Điều khiển ComboBox ListBox phức tạp so với điều khiển cần định nghĩa mục chọn HTML sử dụng tag để khai báo hai loại điều khiển này: Ví dụ: Mơn học: Visual Basic Visual C++ Java Kết quả: ƒ Thuộc tính size giúp web browser xác định điều khiển ComboBox (size="1") hay ListBox (size>1) ƒ Tag , bạn thấy ví dụ, đặt cặp tag để định nghĩa mục chọn ƒ Tên mục chọn đặt trong cặp tag … ƒ Mục chọn mặc định biểu thị qua thuộc tính selected ƒ Thuộc tính value cho biết giá trị mục chọn Bạn cần biết giá trị mục chọn xử lý liệu nhập form ƒ Nếu bạn muốn ListBox chọn nhiều mục lúc, sử dụng thuộc tính multiple tag Học phần - Lập trình ứng dụng web với ASP.NET Trang 165/174 Tài liệu hướng dẫn giảng dạy III Cascading Style Sheets - CSS III.1 Giới thiệu CSS III.1.1 CSS ƒ CSS: Cascading Style Sheets ƒ Các Style định nghĩa cách trình duyệt hiển thị đối tượng HTML ƒ Các Style lưu Style Sheet ƒ Các Style Sheet độc lập lưu file CSS riêng biệt ƒ Các Style Sheet độc lập tiết kiệm nhiều thời gian cho bạn ƒ Nhiều định nghĩa Style cho loại đối tượng sử dụng theo lớp III.1.2 Style giúp bạn giải nhiều vấn đề HTML tag thiết kế để định dạng cách hiển thị nội dung trang Web cách định nghĩa "đây phần header", "đây đoạn", "đây bảng",… Mỗi trình duyệt hiển thị nội dung trang Web theo cách riêng dựa định nghĩa Các trình duyệt thơng dụng Internet Explorer hay Netscape liên tục thêm thắt tag HTML riêng vào danh sách HTML tag chuẩn W3C làm cho việc tạo lập văn Web để hiển thị độc lập trình duyệt ngày khó khăn Để giải vấn đề này, W3C (World Wide Web consortium- tổ chức chịu trách nhiệm tạo lập chuẩn Web) tạo STYLE cho HTML 4.0 Cả Netscape 4.0 Internet Explorer 4.0 hỗ trợ Cascading Style Sheets I.1.1 Style Sheet tiết kiệm nhiều công sức thiết kế Các Style HTML 4.0 định nghĩa cách mà thành phần HTML hiển thị Các Style thường lưu file độc lập với trang Web bạn Các file CSS độc lập cho phép bạn thay đổi hình thức thể khuôn dạng tất trang Website thống mà phải thực thay đổi lần I.1.2 Style dùng? Ta nói rằng, Style sử dụng theo "lớp" (cascade) ưu tiên nhiều Style định nghĩa thành phần HTML tham chiếu file HTML Thứ tự ưu tiên xếp từ cao xuống thấp: ƒ Style cho thành phần HTML cụ thể ƒ Style phần HEAD ƒ Style file CSS ƒ Mặc nhiên theo trình duyệt Học phần - Lập trình ứng dụng web với ASP.NET Trang 166/174 Tài liệu hướng dẫn giảng dạy III.2 Cú pháp CSS Cú pháp CSS gồm phần: đối tượng, thuộc tính giá trị: Đối tượng {thuộc tính: giá trị} Đối tượng thường tag HTML mà bạn muốn định nghĩa cách hiển thị Thuộc tính thuộc tính hiển thị đối tượng Giá trị cách mà bạn muốn thuộc tính hiển thị Cặp {thuộc tính: giá trị} đặt dấu {} Body {color: black} Nếu giá trị gồm nhiều từ, đặt chúng dấu nháy đôi: p {font-family: "sans serif"} Nếu bạn muốn định nghĩa nhiều thuộc tính đối tượng, phân cách cặp thuộc tính: giá trị dấu (;) p {text-align: center; color: red} Để định nghĩa Style dễ đọc hơn: P { text-align: center; color: black; font-family: arial } III.2.1 Nhóm nhiều đối tượng Bạn định nghĩa Style cho nhiều đối tượng lúc: h1, h2, h3, h4, h5, h6 { color: green } III.2.2 Thuộc tính Class Với thuộc tính Class, bạn định nghĩa nhiều Style khác cho đối tượng Ví dụ, bạn muốn có hai Style cho tag

, tag

có class=right canh lề bên phải, class=center canh giữa: p.right {text-align: right} p.center {text-align: center} Trong trang HTML:

Đoạn canh phải

Đoạn canh Học phần - Lập trình ứng dụng web với ASP.NET Trang 167/174 Tài liệu hướng dẫn giảng dạy

Bạn bỏ qua tên đối tượng để định nghĩa kiểu Style cho tất thành phần có Class mà bạn định nghĩa Ví dụ: center { text-align: center; color: red } Trong trang HTML sau, H1 đoạn văn canh giữa: Tiêu đề canh

Đoạn canh

III.2.3 Thuộc tính ID Thuộc tính ID dùng định nghĩa Style theo hai cách: Tất thành phần HTML có ID Chỉ thành phần HTML có ID định nghĩa Ví dụ sau, Style dùng cho tất thành phần HTML có ID "intro": #intro { font-size:110%; font-weight:bold; color:#0000ff; background-color:transparent } Ví dụ sau, Style dùng cho thành phần

có ID "intro" trang Web p#intro { font-size:110%; font-weight:bold; color:#0000ff; background-color:transparent } III.2.4 Ghi CSS CSS dùng cách ghi tương tự ngôn ngữ C: đoạn ghi bắt đầu /* kết thúc */ Ví dụ: /* Đây phần ghi */ Học phần - Lập trình ứng dụng web với ASP.NET Trang 168/174 Tài liệu hướng dẫn giảng dạy p { text-align: center; /* Đây phần ghi */ color: black; font-family: arial } III.3 Sử dụng CSS trang HTML III.3.1 Làm chèn vào Style Sheet Khi trình duyệt đọc Style, định dạng nội dung trang Web theo Style Có cách để sử dụng Style trang HTML III.3.2 Dùng file CSS riêng File CSS độc lập nên dùng Style áp dụng cho nhiều trang Mỗi trang sử dụng Style định nghĩa file CSS phải liên kết đến file tag đặt phần HEAD: Ví dụ file CSS: Style.css hr {color: sienna} p {margin-left: 20px} body {background-image: url("images/back40.gif")} III.3.3 Định nghĩa Style phần HEAD Các Style định nghĩa phần HEAD dùng cho nhiều thành phần HTML trang Web Bạn sử dụng tag để định nghĩa Style: hr {color: sienna} p {margin-left: 20px} body {background-image: url("images/back40.gif")} Ghi chú: Trình duyệt thường bỏ qua tag HTML mà khơng biết, để trình duyệt khơng hỗ trợ CSS khơng hiển thị phần định nghĩa Style, bạn nên đặt tag ghi HTML: Học phần - Lập trình ứng dụng web với ASP.NET Trang 169/174 Tài liệu hướng dẫn giảng dạy III.3.4 Dùng Style cho thành phần HTML cụ thể Style cho tag HTML cụ thể gần không tận dụng lợi điểm CSS ngoại trừ cách hiển thị đối tượng Bạn dùng thuộc tính Style để định nghĩa Style cho thành phần HTML

Đây đoạn văn

III.3.5 Nhiều Style cho đối tượng Nếu đối tượng định nghĩa nhiều Style, sử dụng Style cụ thể Ví dụ, file CSS định nghĩa tag H3 sau: h3 { color: red; text-align: left; font-size: 8pt } Trong file HTML có phần định nghĩa Style cho H3 sau: h3 { text-align: right; font-size: 20pt } Nếu trang HTML có link đến file CSS trên, Style cho H3 định nghĩa sau: Color: red; text-align: right; font-size: 20pt III.3.6 Các ví dụ a Màu chữ, màu body {background-color: rgb(250,250,250)} Học phần - Lập trình ứng dụng web với ASP.NET Trang 170/174 Tài liệu hướng dẫn giảng dạy h1 {background-color: #00ff00; color: #0000ff} h2 {background-color: transparent; color: #dda0dd} p {color: #0000FF}} Đây dòng tiêu đề: Header 1 Đây dòng tiêu đề: Header 2

Đây đoạn văn bản

b Canh lề văn h1 {text-align: center} h2 {text-align: left} h3 {text-align: right} Đây Header 1 Đây Header 2 Đây Header 3 Học phần - Lập trình ứng dụng web với ASP.NET Trang 171/174 Tài liệu hướng dẫn giảng dạy c Hình cho trang Web Body { background-image: url('Hinh_nen.jpg'); background-repeat: repeat-x } Mặc định, hình tô đầy trang Web Tuy nhiên, muốn tơ hình theo hướng ngang, hay đứng, ta chọn giá trị cho thuộc tính background-repeat tương ứng: repeatx/repeat-y/repeat-xy d Font chữ Ví dụ 1: h1 {font-family: Tahoma; font-size: 150%} h2 {font-family: Tahoma; font-size: 120%} h3 {font-family: Tahoma; font-size: 12} p {font-family: Tahoma;} p.sansserif {font-family: sans-serif} Đây header 1 còn header 2 và header 3

Đây đoạn văn bản

Đây đoạn văn có font sansserif

Học phần - Lập trình ứng dụng web với ASP.NET Trang 172/174 Tài liệu hướng dẫn giảng dạy Ví dụ 2: p{text-align:justify; font-family: Tahoma; font-size: 12px; border-bottom: 2px solid #ff0000}

Để biết Web Service cung cấp miễn phí mạng, bạn dùng google để thực tìm kiếm Ở đây, giới thiệu đến bạn trang: http://www.webservicex.net cung cấp nhiều Web Service hữu ích

e Quản lý màu hiển thị liên kết: Hyperlink a {text-decoration:none; color: #0000FF} a:visited {text-decoration:none; color: #0000A0} a:hover {text-decoration:none; color: #FF00FF} a:active {text-decoration:none; color: #FF0000} Học phần - Lập trình ứng dụng web với ASP.NET Trang 173/174 Tài liệu hướng dẫn giảng dạy

Trang Quản lý giáo viên - TTTH

Học phần - Lập trình ứng dụng web với ASP.NET Trang 174/174 ... người lập trình phải sử dụng kỹ thuật lập trình hướng đối tượng (sẽ nói tới chương sau) Học phần - Lập trình ứng dụng web với ASP.NET Trang 15/174 Tài liệu hướng dẫn giảng dạy II.3 Tìm hiểu ASP.Net. .. tiết: Học phần - Lập trình ứng dụng web với ASP.NET Trang 5/174 Tài liệu hướng dẫn giảng dạy GIÁO TRÌNH LÝ THUYẾT TÀI LIỆU THAM KHẢO Trong trình biên soạn tài liệu hướng dẫn giảng dạy giáo trình, ... Unicode Bên cạnh đó, giáo viên hướng dẫn cho học viên cách tạo Virtual directory ánh xạ đến thư mục ứng dụng, sử dụng IIS để quản lý ứng dụng web Học phần - Lập trình ứng dụng web với ASP.NET Trang