phát triển phần mềm quản lý tour du lịch dùng html5css3

Một trong những tính năng chính của HTML5 là giúp cho người phát triển dễ dàng phát triển các ứng dụng cho các thiết bị di động, ứng dụng web, cùng với phần hỗ trợ giao diện người dùng m

Trang 1

LU ẬN VĂN TỐT NGHIỆP ĐẠI HỌC

Sinh viên thực hiện:

Đoàn Văn Quý MSSV:1091704

HK II, 2012 - 2013

Trang 2

GVHD: Th.S Võ Hu ỳnh Trâm Trang 1

TRƯỜNG ĐẠI HỌC CẦN THƠ

KHOA CÔNG NGH Ệ THÔNG TIN

Lu ận văn được bảo vệ tại: Hội đồng bảo vệ luận văn tốt nghiệp Bộ Môn

Ph ần Mềm, Khoa Công nghệ thông tin và Truyền Thông, Trường Đại học

C ần Thơ vào ngày 10 tháng 05 năm 2013

Có thể tìm hiểu luận văn tại:

 Thư viện Khoa Công nghệ thông tin và Truyền thông, Trường Đại học Cần Thơ

 Trung tâm học liệu của trường Đại Học Cần Thơ

 Website: http://www.cit.ctu.edu.vn

Cán bộ hướng dẫn:

ThS Võ Hu ỳnh Trâm

MSCB: 1069

Sinh viên thực hiện:

Đoàn Văn Quý

MSSV:1091704

Trang 3

L ỜI CẢM ƠN

Đầu tiên, em xin chân thành cảm ơn và gửi lời cảm ơn đến Cô Võ Huỳnh Trâm đã tạo điều kiện thuận lợi cho em thực hiện hiện đề tài luận văn này và

cô tận tình hướng dẫn trong suốt quá trình em thực hiện luận văn

Em xin gửi lời cảm ơn sâu sắc tới quý Thầy Cô trong Khoa Công nghệ thông tin và Truy ền thông Trường ĐH Cần Thơ đã truyền đạt kiến thức quý báu cho em trong nh ững năm học vừa qua

Xin gửi lời cảm ơn đến các bạn, đặc biệt là các thành viên trong lớp DI0996A2 đã cùng đoàn kết, ủng hộ, giúp đỡ tôi trong suốt thời gian học tập trên giảng đường đại học và thực hiện đề tài

Dù đã rất cố gắng để hoàn thành một cách tốt nhất, nhưng sai sót là điều không tránh khỏi Em rất mong nhận được những ý kiến đóng góp của thầy cô và các bạn

Em xin chân thành cảm ơn!

Cần Thơ, ngày 10 tháng 4 năm 2013

Sinh viên thực hiện

Đoàn Văn Quý

Trang 4

Cán bộ hướng dẫn

ThS Võ Huỳnh Trâm

Trang 5

Cán bộ phản biện

Ks Hồ Quang Thái

Trang 6

Cán bộ phản biện

Ths Nguyễn Công Danh

Trang 7

2.4.HỆ QUẢN TRỊ CƠ SỞ DỮ LIỆU MySQL 39 CHƯƠNG III ỨNG DỤNG VÀ XÂY DỰNG HỆ THỐNG 40

3.1.ĐẶC TẢ YÊU CẦU PHẦN MỀM(IEEE/IEA 12207.1-1997) 40 3.1.1 Giới thiệu 39 3.1.2 Mô tả tổng quan 41 3.1.3 Môi trường vận hành 48 3.1.4 Các ràng buộc về thực thi và thiết kế 50 3.1.5 Các yêu cầu giao tiếp bên ngoài 51 3.1.6 Các tính năng hệ thống 52 3.1.7 Các yêu cầu phi chức năng 68 3.2 THIẾT KẾ PHẦN MỀM(IEEE/IEA 12207.1-1997) 69 3.2.1 Phân rã hệ thống có chọn lọc 69 3.2.2 Môi trường vận hành 72 3.2.4 Thiết kế kiếm trúc 74

Trang 8

3.2.5 Mô hình kiến trúc hệ thống 75 3.2.6 Kiến trúc phần mềm 76 3.2.7 Mô hình triển khai ứng dụng 79 3.2.8 Yêu cầu hệ thống 81 3.2.9 Thiết kế dữ liệu 83 3.2.10 Thiết kế giao diện(chọn lọc chức năng) 94

3.3.Kiểm thử phần mềm(IEEE 983-1986) 116 3.3.1 Mục tiêu 115 3.3.2 Phạm vi 115 3.3.3 Công cụ kiểm thử và môi trường kiểm thử 116 3.3.4 Kiểm thử chức năng có chọn lọc 117 CHƯƠNG IV KẾT LUẬN 124 4.1 Kết quả đạt được 123

4.3 Hướng phát triển 123 TÀI LIỆU THAM KHẢO 125

Trang 9

CÁC TỪ VIẾT TẮT

Trang 10

II.7 Kết quả thực thi từ trình duyệt khi tạo bóng đỗ 23

II.9 Trình duyệt thực thi đối tượng di chuyển 24

Trang 11

of its most powerful This really stand out with the creation of intuitive interface, more attractive to users Beside the creation to the usual wed,HTLM5 & CSS3 also strongly supports the development of smart phone applications Especially, the demading of game graphics 2D/3D

The management software tour can be used by many of technologies to develop, but mainly uses two new technologies are developed HLM5 & CSS3 user interface and functionally of the system In this software mainly support three main user groups: customers, members and system administrators The main function of the support system for the different user groups such as: tour booking, tour members, visitors tour design, tour members design, visitors tour quotation system, more tuor new tourism, added to the tour schedule, online support for customers

The result of the thesis is approximately complete construction management software tour runs well on multiple browers and operating systems, applications HTML5 & CSS3 basic design and functionality of the interface software

Trang 12

TÓM TẮT

HTML5 & CSS3 là nền tảng phát triển mới của W3C với nổ lực hỗ

trợ mạnh cho cho những sản phẩm mới của Apple và Google Một trong

những tính năng chính của HTML5 là giúp cho người phát triển dễ dàng phát triển các ứng dụng cho các thiết bị di động, ứng dụng web, cùng với

phần hỗ trợ giao diện người dùng mạnh nhất của nó Điều này thực sự nổi

bật với việc tạo ra các giao diện trực quan, hấp dẫn hơn với người sử dụng Ngoài việc tạo ra những trang web thông thường, HTML5&CSS3 còn hỗ

trợ mạnh mẽ phát triển các ứng dụng di động thông minh Đặc biệt là phát triển các các trò chơi đòi hỏi cao về đồ họa 2D/3D

Phần mềm quản lý tour du lịch có thể được sử dụng nhiều công nghệ để phát triển, nhưng chủ yếu sử dụng hai công nghệ mới là HTML5

& CSS3 phát triển giao diện người dùng cũng như chức năng của hệ thống Phần mềm chủ yếu hỗ trợ cho ba nhóm người dùng chính: khách, thành viên, quản trị hệ thống Các chức năng chính của hệ thống cho phép khách hàng xem thông tin chi tiết của các tour, đặt tour, thiết kế tour theo nhu cầu riêng của khách, thương lượng giá tour vừa thiết kế, Người quản trị hệ thống có thể: thêm tour du lịch mới, thêm lịch trình cho tour du lịch, hỗ trợ trực tuyến cho khách,

Kết quả thực hiện đề tài là xây dựng tương đối hoàn chỉnh phần mềm quản lý tour du lịch chạy tốt trên nhiều trình duyệt và hệ điều hành,

cơ bản ứng dụng được HTML5&CSS3 trong thiết kế giao diện và chức

năng của phần mềm

Trang 13

CHƯƠNG I TỔNG QUAN

Nói về ý nghĩa và tầm quan trọng của công nghệ website, chúng ta

có thể nói đây là phương tiện truyền thông tin, tin tức, cũng như nhiều dữ liệu quan trọng khác trong cuộc sống hàng ngày Ngày này, website không còn xa lạ gì với người sử dụng, trong đó có người dùng dụng máy tính để

thực hiện duyệt web, ngoài ra cũng có người dùng dùng thực hiện duyệt web bằng thiết bị di động thông minh Web gắn bó với cuộc sống đến mức ngoài chức năng của nó là truyền thông tin, web còn là phương tiện giúp người dùng có thể giả trí, trao đổi thông tin

Với sự phát triển không ngừng của công nghệ web, cũng như các nhà phát triển website ngày càng nhiều, thì các trang web trở nên linh động

và có hiệu suất hoạt động cao nhất Ngoài ra, các nhà phát triển còn sử dụng các CMS để phát triển các website thông tin

Website quản lý tour du lịch phát triển bằng HTML5 & CSS3, được phát triển dựa trên hai công nghệ chính là HTML5 & CSS3, bên cạnh hai công nghệ mới này, phần mềm còn sử dụng nhiều thư viện mã nguồn mở như: jquery, php, sử dụng lưu trữ thông tin và dữ liệu với hệ quản trị cơ sở

dữ liệu MySQL Với ba thành phần chính để xây dựng nên hệ thống này HTML5&CSS3, PHP, MySQL

HTML5 & CSS3 nổi bật với khả năng hoạt động ổn định và linh

hoạt, được hỗ trợ bởi nhiều trình duyệt, với sự hỗ trợ mạnh mẽ của HTML5, người dùng không cần phải cài các plugin flash để chạy các video hay audio, tính năng này được hỗ trợ mạnh trên thiết bị di động của

Trang 14

Tính năng mới của HTML5&CSS3 được xem là điểm mạnh của chúng trong phát triển phần mềm, cũng như trong phát triển ứng dụng di động, giúp công nghệ web đang dần vượt qua flash, sliverlight nặng nề cho trình duyệt

HTML5&CSS3 là “mỏ vàng” cho người phát triển các ứng dụng với số lượng các ứng dụng miễn phí lớn, cùng với số lượng người dùng đong đảo sử dụng các ứng dụng thông qua các nền tảng về di động và desktop Các nhà phát triển ứng dụng web bằng công nghệ HTML5&CSS còn được hưởng một khoản đầu tư lớn từ gã khổng lồ Apple

Hiện nay, HTML5&CSS3 là sự lục chọn hàng đầu cho các nhà phát triển web, với xu thế này thì trong thời gian không xa các trang web và ứng dụng sử dụng hai công nghệ mới là HTML5&CSS3 sẽ tăng một lượng đáng kể về số lượng và chất lượng Bên cạnh đó hai công nghệ này còn giúp các nhà phát triển phát triển các ứng dụng desktop, game 2D, 3D sinh động, thu hút người sử dụng ngày càng đông Trong tương lai, những sản phẩm về hai công nghệ này sẽ được sử dụng một cách rộng rãi

Với những ưu điểm trên thì HTML5&CSS3 hứa hẹn sẽ mang đến cho người dùng những sản phẩm tốt nhất và hoàn hảo nhất Trong đề tài này, chúng tôi nói về ý nghĩa, tầm quan trọng, cũng như phương thức hoạt động của các thành phần chính HTML5&CSS3 Bên cạnh đó, chúng tôi xây dựng phần mềm quản lý tour du lịch bằng HTML5&CSS3 với ngôn

ngữ lập trình chủ yếu là Javascript và PHP

- Nắm được các kiến thức về HTML5&CSS3

- Các kỹ thuật định dạng với HTML5&CSS3

- Các kỹ thuật lập trình bằng ngôn ngữ Javascript và PHP

- Xây dựng website quản lý tour du lịch

- Việc nghiên cứu công nghệ cũng như kỹ thuật còn hạn chế, website đòi hỏi kinh nghiệm cao về thiết kế đồ họa giao diện người dùng

- Còn nhiều thiếu xót về lập trình

- CSDL lưu trữ còn nhiều thiếu xót, chưa tối ưu đến mức tốt nhất

Trang 15

Các trang web quản lý về du lịch hiện nay có rất nhiều, được nhiều

lập trình viên phát triển, chạy tốt trên nhiều trình duyệt khác nhau

 Cholontourist(nguồn : http://cholontourist.com.vn/, trang web này được phát triển để quản lý các tour du lịch nhưng giao diện còn đơn thuần Còn nhiều thiếu soát và chưa quản lý được người dùng là khách, chưa cho phép khách hàng thiết kế các tour trực tuyến, đặt tour phải liên hệ trực tiếp với nhân viên của quản lý hệ thống Trong các phần phát triển thì giao diện của trang còn thô sơ)

 Du lịch Huế(nguồn: http://webdulichhue.com/, đây là trang quản lý

du lịch tương đối tốt, nhưng chưa giải quyết được cho khách hàng đặt tour trực tuyến hay thiết kế các tour theo ý của khách hàng)

 Ngoài những website được viết bằng ngôn ngữ php, bên cạnh đó còn có những website được viết bằng ngôn ngữ NET sliverlight, jsp,

Các website trên nhìn chung khá hoàn thiện, tuy nhiên với sự hỗ trợ

của công nghệ thiết kế web mới trên HTML5&CSS3 sẽ giúp cho website

trở nên thân thiện và hoàn hảo hơn với người sử dụng Website quản lý tour du lịch còn được giải quyết được công việc của nhiều trang web như: đặt tour trực tuyến nhanh chóng, thiết kế tour du lịch theo ý của khách hàng, giúp khách hàng có thể báo giá được với người quản trị hệ thống để

có được một tour ưng ý

- Tìm hiểu về hai công nghệ HTML5&CSS3 thông qua trang web http://www.w3schools.com, sách html5&css3 for the real world,

- Tìm hiểu về các trang web có liên quan để có được những thông tin về website tốt nhất

- Tìm hiểu về jquery, ajax, php, javascript,

- Tìm hiểu về MySQL

- Xây dựng đặc tả website

Trang 16

- Nghiên cứu lập trình web

- Thiết kế dữ liệu, giao diện

- Viết quyển báo cáo

Về lý thuyết: nội dụng quyển báo cáo sẽ tập trung vào hai thành

phần chính là HTML5&CSS3 như lịch sử phát triển, các thành phần của HTML5&CSS3, các yêu tố tạo nên phần mềm, kiến trúc lập trình, cũng như sự khác biệt giữa HTML5&CSS3 với các phiên bản trước đó của chúng Bên cạnh đó còn sử dụng các thành phần chính của HTML5&CSS3

để thực hiện các yêu cầu của phần mềm.

Về ứng dụng: xây dụng một phần mềm quản lý tour du lịch trong

khuôn khổ sử dụng HTML5&CSS3 với các yêu cầu như sau: cho phép người dùng đặt tour online, thiết kế tour mới theo tour đã có sẵn, cho phép người dùng thực hiện báo giá với hệ thống giá tour mà mình muốn đi,

Trang 17

Nghiên cứu đề tài, tìm hiểu HTML5&CSS3 và thường xuyên báo cáo tiến độ với giáo viên hướng dẫn

2 07/01/2013-13/01/2013 • Tìm hiểu HTML5

• Tìm hiểu CSS3

• Tìm hiểu các công nghệ khác: PHP, Javascript, jquery, ajax,

• Phân tích đề tài, thiết kế dữ liệu cho hệ

• Viết tài liệu: Chương II Cơ sở lý thuyết

• Viết tài liệu: Chương III Ứng dụng và xây dựng hệ thống

14 01/04/2013-07/04/2013

15 08/04/2013-14/04/2013

16 15/04/2013-21/04/2013 • Hoàn thành phần mềm và kiểm thử chức

năng

Trang 18

17 22/04/2013-28/04/2013

• Tổng hơp tài liệu

• Chuẩn bị slide báo cáo thử

18 29/04/2013-05/05/2013

• Hoàn chỉnh quyển báo cáo

• Chuẩn bị slide báo cáo chính thức

• Nộp quyển báo cáo cho hội đồng

19 06/05/2013-10/05/2013 • Báo cáo chính thức trước hội đồng

Trang 19

HTML5 là một ngôn ngữ đánh dấu siêu văn

bản với phiên bản thứ 5, được W3C đưa vào nghiên

cứu từ năm 2009, cho đến hiện HTML5 vẫn chưa

hoàn thiện về tính năng Nhưng có một số thẻ của

HTML5 đã hoạt động ổn định

b Giới thiệu

HTML5 chạy tốt trên mọi trình duyệt, nhưng bên cạnh đó cũng còn

một số trình duyệt còn bị hạn chế một số thẻ mới

Bên cạnh việc HTML5 hỗ trợ cho các desktop thì nó còn hỗ trợ

chạy tốt trên các thiết bị di động và smartphone, ngoài ra còn hỗ trợ cho các thiết bị smartphone chạy tốt các video và audio mà không cần dùng đến các phần mềm hỗ trợ HTML5 có một công đồng nhà phát triển rất lớn viết các ứng dụng cho công nghệ mới này Dù còn rất mới và chưa hoàn thiện về tính năng, nhưng HTML5 có nhiều tổ chức dựa vào nó mà phát triển các ứng dụng mạnh mẽ, các website trong tương lai cũng tiến dần đến

sử dụng HTML5 cho sản phẩm của mình Các nhà phát triển HTML5 chủ

yếu dựa vào hai ngôn ngữ lập trình chính là javascript và PHP, ngoài ra họ còn dùng các framework của hai ngôn ngữ chính này Nhưng với một cải tiến mới trong HTML5 là sự kết hợp của ba nền tảng là HTML + CSS + Javascript Các thẻ mới của HTML5 cho phép các nhà phát triển không

cần phải viết các đoạn script rườm rà để thực hiện bẫy lỗi người dùng phía client, mà ngược lại với tính năng thông minh của HTML5, nó tự động thực hiện việc bẫy lỗi này với các thông số trong thẻ đó

Hình II.1: Logo HTML5

Trang 20

Cho tới hiện tại, HTML5 vừa phát triển mới, vừa năng cấp thẻ định

dạng, tổng số thẻ của HTML5 tăng lên rất nhiều, với những tính năng và

hiệu suất thực hiện tốt hơn nhiều Nhưng bên cạnh đó cũng còn một số hạn chế về sự hỗ trợ của trình duyệt, cũng như nền tảng phần cứng chưa thực

sự hỗ trợ mạnh các tính năng này

HTML5 được W3C và WHATWG chính thức đưa vào nghiên cứu vào năm 2009, được phát triển theo mô hình cuốn chiếu nên HTML5 đang hoàn thiện nốt các phần còn lại, nhưng những phần đã ra mất thì nhanh chống được hỗ trợ HTML5 đã sớm được hỗ trợ trong các trình duyệt trên

PC như Mozilla Firefox(v3.5+), Apple Safari(v4.0+), Opera(v10.0+), Google Chrome(v3.0+), trong đó chậm nhất là Internet Explorer của Microsoft cũng đã bắt đầu hỗ trợ HTML5 ở phiên bản thứ 9(v9.0+) Bên cạnh hỗ trợ cho PC, HTML5 còn phát triển để hỗ trợ tốt trên smartphone

và máy tính bảng Mặc dù mới được phát triển từ năm 2009, nhưng HTML5 đã thể hiện dược thế mạnh của mình trong phát triển web, đặc biệt nhất là việc hai hệ điều hành lớn là iOS đã nói không với adobe flash để

tận dụng hết tính năng của HTML5, từ phiên bản Android 4.1(v4.1) hệ điều hành cũng đã từ chối hẳn Adobe flash để hỗ trợ HTML5

c Tính năng

HTML5 được xây dựng để cho phép các nhà phát triển tạo ra các sản phẩm và các ứng dụng giành cho di động tận dụng tất cả những tính năng mà trình duyệt hỗ trợ HTML5 không phân biệt hệ điều hành, miễn trình duyệt hỗ trợ thì HTML5 chạy tốt Nhưng với những tính năng của HTML5 trong đó có một thẻ đáng chú ý nhất là thẻ canvas, thẻ này cho phép nhà phát triển tận dụng để phát triển các ứng dụng đồ họa 2D và 3D sinh động, với các ứng dụng 3D cần tới đồ họa cao thì cần đến sự hỗ trợ

của phần cứng, quan trọng nhất là card đồ họa

Ngoài ra, còn hai thẻ tương đối quan trọng là video, audio có thể nói rằng hai thẻ này được phát triển giành riêng cho hai nền tảng hệ điều hành lớn là iOS và Andoid(v4.1+)

Trang 21

d Lịch sử phát triển

Ban đầu HTML được phát triển dùng trong truyền và quảng bá thông tin đơn thuần, nhưng dần về sau khi công nghệ phát triển cũng như yêu cầu của người dùng ngày càng cao thì yêu cầu về tính năng cũng như giao diện cũng được HTML phát triển theo yêu cầu của người dùng Với các phiên bản(version) phát triển khách nhau thì HTML cũng có những tính năng và công dụng khác nhau trong giai đoạn phát triển

Hình II.2: L ịch sử phát triển của HTML

Trang 22

Giai đoạn phát triển của HTML theo từng năm:

Cuối năm 1990, ngôn ngữ đánh dấu siêu văn bản ra đời với vỏn vẹn

20 thẻ được định nghĩa

Tháng 7/1994, HTML2 được ra đời, phiên bản này ra đời được là

nhờ sự nỗ lực rất lớn của một công động yêu thích HTML phát triển nên Cũng trong năm này tổ chức World Wide Web được thành lập, cũng chính

tổ chức này cũng là tổ chức đảm nhiệm sự phát triển của HTML cho đến ngày nay

Năm 1995, hai thẻ mới được ra đời, đó là bước ngoặc lớn cho cộng

đồng yêu thích HTML đó là thẻ bgcolor và thẻ font face

Cuối năm 1995, cũng là thời gian giành cho sự ra đời của HTML3,

đó cũng chỉ là tên gọi hình thức vì trong thời gian này CSS và Javascript cũng chính thức ra đời

Năm 1997, HTML4 được ra đời, phiên bản này là phiên bản được

nhiều người mong đợi nhất, HTML4 kết hợp cùng với CSS và Javascript đã mang lại sự thỏa sức thiết kế cho các nhà phát triển website, với phiên bản này HTML đã có một tương lai tốt hơn khi HTML4 đã nhận được chứng nhận bởi W3C

Tháng 1 năm 2008, W3C tung ra phiên bản đầu tiên cho sự phát

triển của HTML5 tạm gọi là HTML5.1, phiên bản này mang lại nhiều cải tiến cho một ngôn ngữ đánh dấu siêu văn bản Cho đến thời điểm hiện tại thì các nhà phát triền website có thể làm chủ được các tính năng mới này, cải tiến quan trọng nhất trong HTML5 là ở thể Video, nó làm cho các nhà phát triển trở nên thật nhẹ nhàng trong việc phát triển, thẻ video đã chạy tốt nhờ sự hỗ trợ của trình duyệt mà không cần thông qua flash và các plugin khác Ngoài ra còn nhiều thẻ mới cho bạn thỏa sức trải nghiệm như: article, aside, audio, camvas, heder, footer,

e Cú pháp

Cú pháp của HTML thông thường

 Mở đầu trang <html>

 Tiêu đề trang <title>Tiêu đề trang</title>

 Đầu đề <head>Khai báo thông tin</head>

Trang 23

Chào mừng bạn đến với du lịch chơ lớn

</body>

</html>

Cú pháp HTML5

 Mở đầu trang bằng <html>

 Tiêu đề trang<title>Tiêu đề</ttile>

 Phần khai báo<head>chứa các thành phần khai bào</head>

 Phần trình duyệt hiển thị<body>nội dung trang

 Phần cuối trang <footer>thông tin cty</footer>

 Kết thúc phần thân trang</body>

 Kết thúc trang </html>

Trang 24

<footer> Địa chỉ: 192 – 194 Sư Vạn Hạnh, Phường 9, Q5, Tp

hiển thị (font chữ, kích thước, màu sắc ) cho một tài

liệu Web CSS3 là phiên bản thứ 3 trong quá trình phát

triển của CSS

Hình II.3: Logo CSS3

Trang 25

b Giới thiệu

CSS quy định cách hiên thị của các thẻ HTML bằng cách qui định các thuộc tính của các thẻ(font, color, ), để cho thuận tiện bạn có thể đặt toàn bộ các thẻ của css nằm trong một tập tin co phần mở rộng là *.css

CSS phá vỡ giới hạn trong thiết kế web, bởi vì chỉ cần 1 tập tin CSS là bạn có thể quản lý toàn bộ định dạng và bố trì bố cục trên nhiều trang khác nhau Các nhà phát triển web có thể định nghĩa sẵn thuột tính của một thẻ HTML nào đó và sau đó nó có thể dùng lại ở nhiều nơi khác nhau

Có nhiều cách cho phép nhà phát triển khai báo các định dạng CSS, chẳng hạn như: khai báo một thẻ <style></style> trong nội dung của

thẻ <head></head>, có thể tạo ra một tập có phần mở rộng là *.css rồi sau

đó cần dùng tại tập tin nào thì chỉ dường dẫn từ tập tin đó đến thư mục

chứa tập tin *.css hoặc định nghĩa những định dạng CSS trong chính mỗi thẻ HTML được sử dụng

Tuy có những cách đặt các định dạng CSS khác nhau, nhưng với những cách đặt như vậy sẽ có một mức độ ưu tiên khác nhau cho từng cách đặt, như: style đặt trong từng thẻ riêng biệt -> style đặt trong phần head -> style đặt trong tập tin mở rộng *.css - > style mặc định của trình duyệt, mức độ giảm dần từ trái sang phải

Cùng với sự phát triển của công nghệ Web, thì CSS3 cũng phát triển không ngừng, với hơn mười lăm năm phát triển, nhưng CSS có

những tiến bộ vượt bậc trong lĩnh vực Web, ngoài những tính năng cũ được cải tiến, CSS3 còn cho ra đời những tính năng mới rất hấp dẫn và mang tính cạnh tranh cao

Trang 26

b Tính năng

Nhìn chung, dù còn trong giai đoạn phát triển và hoàn thiện, nhưng CSS3 đã thể hiện được sức mạnh của mình trong lĩnh vực thiết kế website CSS3 ra đời không bao lâu nhưng nó đã và đang là ngôn ngữ định dạng được các nhà phát triển ưa chuộng nhất, do nó có những tính năng hoàn

hảo giúp cho các nhà phát triển web không cần phải bỏ thời gian dài ra để

thực hiện, ví dụ như: tính năng border-radius:Xpx; tính năng này cho phép

nhà phép triển thực hiện bo góc một thẻ nào đó theo số pixel được quy định, khi CSS3 chưa ra đời thì công việc này là vô cùng vất vả, nó buột người dùng phải dùng đến các phần mềm xử lý ảnh chuyên nghiệp để có

thể bo góc được như thẻ <border-radius> làm được.

Hình II.4: Mã th ực thi CSS bo tròn góc

Hình II.5: Kết quả từ trình duyệt

thực thi bo tròn góc

Trang 27

Các nhà phát triển web thì không ai không biết đến một tính năng

cũng không kém phần hấp dẫn đó là box-shadow: Xpx, Ypx, Zpx, color

thực hiện đổ bóng cho một đối tượng được chọn

Hình II.6: Mã th ực thi tạo bóng đỗ

Hình II.7: Kết quả từ trình duyệt khi thực hiện tạo bóng đổ

Trang 28

Một tính năng mới của CSS3 là Animation, nó đòi hỏi nhà phát triển phải bỏ nhiều thời gian nghiên cứu và phát triển, tính năng này là hoàn toàn mới chỉ có ở CSS3, nó cho phép nhà phát triển thực hiện làm chuyển động các đối tượng theo ý yêu cầu của bài toán Ngoài ra, tính năng này còn giúp ích rất nhiều cho các nhà phát triển ứng dụng web, làm giảm bớt những công đoạn phức tập do phải làm các công việc viết script

là chuyển động các đối tượng

1 1

1 1.1

Hình II.8: Mã thực thi đối tưởng chuyển động

Hình II.9: Trình duyệt thực thi đối tượng di chuyển

Trang 29

Tính năng có tính hấp dẫn cao và thu hút nhiều nhà phát triển website nghiên cứu đó là tính năng 2D/3D transform với tính năng này, nó

cho phép các nhà phát triển kết hợp với HTML5 để tạo nên những ứng

dụng website sinh động và hấp dẫn người sử dụng

Một tính năng khác cũng rất mới là thuộc tính màu nền theo độ sáng alpha, với tính năng này giúp cho nhà phát triển website giảm nhẹ đi

rất nhiều công việc đồ họa

Hình II.10: Màu nền đối tượng được định nghĩa

Trang 30

c Cú pháp

CSS nói chung và CSS3 nói riêng thì có bốn cú pháp để thực hiện

một yêu cầu với trình duyệt:

 Bộ chọn thẻ THML Với bộ chọn này, nhà phát triển có thể định dạng cho tất các thẻ của HTML một lần duy nhất

Trong đó:

o Selector(bộ chọn): xác định các thành phần HTML sẽ được áp dụng kiểu tương ứng

o Property(thuộc tính): các thuộc tính định dạng

o Value: giá trị của các thuộc tính tương ứng

Hình II.11: Bộ chọn thẻ html

Trang 31

 Bộ chọn ID

Bộ chọn này dùng để chỉ định kiểu cho duy nhất một thành phần HTML Các kiểu của bộ chọn ID chỉ áp dụng cho duy nhất các thành phần HTML có thuộc tính ID với giá trị là bộ chọn ID tương ứng

Để áp dụng cho bộ chọn ID trên trong thành phần HTML, ta thực

hiện như sau:

 Bộ chọn class Đây là bộ chọn có thể dùng cho một nhóm các thành phần HTML,

sẽ chỉ áp dụng cho các thành phần HTML có thuộc tính class với các giá trị trên bộ chọn class tương ứng

Hình II.12: B ộ chọn ID cho thẻ

Hình II.13: b ộ chọn class cho thẻ

Trang 32

Để áp dụng được bộ chọn class này, các thành phần HTML phải

có cấu trúc như sau:

Trang 33

PHP là kịch bản cho phép chúng ta xây dựng ứng dụng web trên

mạng internet hay intranet tương tác với các hệ quản trị sơ sở dữ liệu như MySQL, PostgreSQL, Oracle, SQL Server và Access

Từ phiên bản 4.0 trở về sau PHP mới hỗ trợ session, ngoài ra PHP cũng như Perl là kịch bản xử lý chuỗi rất mạnh chính vì chính vì vậy bạn

có thể sử dụng PHP trong những yêu câu xử lý chuỗi

Trang 34

2.2.2 Định nghĩa bộ thẻ PHP

Có bốn loại bộ thẻ PHP khác nhau khi xây dựng một trang PHP:

 Kiểu short: đây là kiểu mật định mà các nhà phát triển PHP thường sử dụng:

Trang 35

2.2.3 Biến trong php

Biến trong PHP được bắt đầu bằng ký tự “$” theo sau là các tên biến Quy tắt đặt tên của biến trong PHP tương tự như trong C Tên biến phân biệt chữ hoa, chữ thường, biến hợp lệ phải bắt đầu là một ký tự hoặc

bắt đầu là một dấu gạch dưới “_” theo sau là số, ký tự Không có khoảng

trắng trong tên biến

Biến trong PHP được khai báo không tường mình, chúng ta khai báo biến trong PHP nhưng không cần biết kiểu của biến đó là kiểu gì, tùy

những trường hợp sử dụng mà PHP nhận các biến theo kiểu như thế nào

Ví dụ:

$var = 10;

$var = “Xin chào!”

Biến được định nghĩa sẵn trong PHP

PHP cung cấp một số lượng lớn các biến đã được định nghĩa trước cho bất kỳ kịch bản nào chạy nó Ví dụ: $_SERVER, $_REQUEST,

$_GET, $_POST, $_FILE, $_SESSION …

 Biến GET ($_GET): là mảng được được chứa những biến được gửi từ Client theo phương thức GET

Ví dụ: $_GET[“tenbien”];

 Biến POST ($_POST): là mảng chứa những biến được gửi theo phương thức POST

Ví dụ: $_POST[“tenbien”];

 Biến $_FILE ($_FILE): là mảng chứa những mục được

tải lên server theo phương thức POST

Ví dụ: $_FILE[“tenbien”];

 Biến REQUEST ($_REQUEST): biến này có thể dùng thay thế $_POST, $_GET … để nhận dữ liệu theo cả hai phương thức POST và GET

Ví dụ: $_REQUEST[“tenbien”];

Trang 36

 Biến SESSION($_SESSION): là mảng chứa những phần

tử mang tính toàn cục được sử dụng cho nhiều trang, thường gọi là biến session

Ví dụ: $_SESSION[“tenbien”];

Trang 37

2.2.4 Kiểu dữ liệu trong PHP

Trong PHP có ba dạng kiểu chính và được phần lớn các máy server hỗ trợ là:

 Số(số nguyên hoặc số thực)

 Mãng

 Chuổi

Ví dụ:

$int_a = 10; //biến int_a kiểu số nguyên

$double_b = 1.5; //biến double kiểu số thực

$str_c = “chào bạn”; //biến str_c kiêu chuỗi

$arr_d[0] = “thứ hai”; //biến kiểu mảng

Object: kiểu dữ liệu đối tượng Kiểu dữ liệu này do người dùng định nghĩa khi thiết kế lớp vì PHP còn là ngôn ngữ hướng đối tượng Khi tạo một đối tượng bạn sử dụng từ khóa “new” và chỉ rõ “class” mà đối tượng có trực thuộc

} //Khai báo sử dụng đối tượng

$c = new myclass();

$c->func1();

?>

Trang 38

Cũng giống như một số ngôn ngữ khác C, C++ …Ngoài ra các hàm được PHP định nghĩa sẵn, PHP cho phép người dùng tự định nghĩa hàm Cú pháp định nghĩa hàm như sau:

- Cú pháp:

Function <tên hàm>($arg_1, $arg_2, …, $_argn){

//các câu lệnh return $giaitri; //Trả về giá trị của hàm

• Truyền theo tham chiếu: Sẽ làm thay đổi giá trị

của biến truyền vào, muốn truyền được theo tham chiếu

ta phải thêm ký hiệu “&” vào trước đối số của hàm

• Truyền theo giá trị mặc định: giá trị mặc định phải

là một biểu thức hằng, không phải là biến hoặc lớp Khi

sử dụng theo cách truyền này thì đối số mặc định phải ở bên phải nhất của các đối số khác

- Giá trị trả về: được thực hiên bởi câu lệnh return

Trang 39

2.3.1 Giới thiệu

Javascript là ngôn ngữ được phát triển dùng trong xử lý các yêu

cầu phía client, trước khi chúng được thông qua môi trường mạng để truyền đến server thực hiện xử lý

Khi muốn xử dụng javascript trong trang web thì có hai cách thông dụng để nhà phát triển chèn đoạn script vào thực thi một tác vụ nào

hiện chèn tập tin đó vào tập tin HTML với cú pháp như sau:

2.3.2 Biến trong javascript

Trong javascript có hai cách khai báo biến, và javascript cũng

là một ngôn ngữ kịch bạn không sử sử dụng khai báo tường minh cho biến,

ví dụ như:

var a = 10;

a = 10;

Trang 40

MySQL là hệ quản trị cơ sở dữ liệu mã nguồn mở phổ biến nhất thế giới và được các nhà phát triển rất ưa chuộng trong quá trình phát triển ứng dụng Vì MySQL là cơ sở dữ liệu tốc độ cao, ổn định và dễ sử dụng,

có tính khả chuyển, hoạt động trên nhiều hệ điều hành cung cấp một hệ thống lớn các hàm tiện ích rất mạnh.Với tốc độ và tính bảo mật cao, MySQL rất thích hợp cho các ứng dụng có truy cập CSDL trên internet MySQL miễn phí hoàn toàn cho nên bạn có thể tải về MySQL từ trang chủ Nó có nhiều phiên bản cho các hệ điều hành khác nhau: phiên bản Win32 cho các hệ điều hành dòng Windows,Linux, Mac OS X, Unix, FreeBSD, NetBSD, Novell NetWare, SGI Irix, Solaris, SunOS,

MySQL là một trong những ví dụ rất cơ bản về Hệ Quản trị Cơ sở

dữ liệu quan hệ sử dụng Ngôn ngữ truy vấn có cấu trúc (SQL)

Định dạng
Số trang	135
Dung lượng	2,07 MB