Tải bản đầy đủ (.doc) (145 trang)

Giao trinh thiet ke va lap trinh web

Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (3.72 MB, 145 trang )

Lập trình Web - Dùng cho hệ đào tạo CĐN CNTT
Lập trình Web - Dùng cho hệ đào tạo CĐN CNTT
MỤC LỤC
MỤC LỤC 1
Phần 1 – NGÔN NGỮ HTML 5
Bài 1: Tổng quan về HTML 5
1 – Giới Thiệu 5
2 – HTML là gì 6
Bài 2: Ngôn ngữ HTML 7
1 – Các thẻ định dạng cấu trúc tài liệu 7
1.1. HTML thẻ định cấu trúc tài liệu 7
1.2. HEAD 7
1.3. TITLE 7
1.4. BODY 7
2 – Các thẻ định dạng khối 9
2.1. Thẻ <P> 9
2.2. Các thẻ định dạng đề mục H1/H2/H3/H4/H5/H6 9
2.3. Thẻ xuống dòng BR 9
2.4. Thẻ PRE 9
3 – Các thẻ định dạng danh sách 9
4 – Các thẻ định dạng ký tự 11
4.1. Các thẻ định dạng ký tự 11
4.2. Căn lề văn bản trong trang Web 12
4.3. Các ký tự đặc biệt 12
4.4. Sử dụng màu sắc trong thiết kế trang Web 12
4.5. Chọn kiểu chữ cho văn bản 14
4.6. Văn bản siêu liên kết 14
4.7. Kết nối mailto 15
4.8. Vẽ một đường thẳng nằm ngang 15
5 – Thẻ chèn âm thanh và hình ảnh 15
5.1. Đưa âm thanh vào một tài liệu HTML 15


5.2. Chèn một hình ảnh, một đoạn video vào tài liệu HTML 16
6 – Chèn bảng biểu 17
7 – Web Forms 19
Trang 1
Khoa ĐTTH – Biên soạn
Khoa ĐTTH – Biên soạn
năm 2011
năm 2011
7.1. HTML FORMS 19
7.2. Tạo FORM 19
7.3. Đặt các đối tượng điều khiển (như hộp văn bản, ô kiểm tra, nút bấm…) 20
7.4. Tạo một danh sách lựa chọn 20
7.5. Tạo hộp soạn thảo văn bản 21
Phần 2 – LẬP TRÌNH WEB VỚI PHP 22
Bài 1: Tổng quan về PHP 22
1 – Giới thiệu PHP 22
2 – Cài đặt PHP 22
3 – Cấu hình ứng dụng PHP 22
4 – Giới thiệu PHP 24
4.1. Yêu cầu 24
4.2. Giới thiệu 24
4.3. Thông dịch trang PHP 24
4.4. Kịch bản (script) 25
4.5. Ghi chú trong PHP 28
4.6. In kết quả trên trang PHP 29
Bài 2: Nền tảng ngôn ngữ PHP 31
1 – Khái niệm cú pháp PHP 31
2 – Khai báo biến 31
3 – Kiểu dữ liệu 32
3.1. Thay đổi kiểu dữ liệu 32

3.2. Kiểm tra kiểu dữ liệu của biến 34
3.3. Thay đổi kiểu dữ liệu của biến 35
3.4. Kiểu mảng (Array) 36
3.5. Kiểu đối tượng 37
3.6. Tầm vực của biến 39
4 – Hằng trong PHP 41
4.1. Khai báo và sử dụng hằng 41
4.2. Kiểm tra hằng 41
Bài 3: Phép toán và phát biểu có điều kiện trong PHP 43
1 – Khái niệm về toán tử 43
Trang 2
Lập trình Web - Dùng cho hệ đào tạo CĐN CNTT
Lập trình Web - Dùng cho hệ đào tạo CĐN CNTT
2 – Giới thiệu toán tử 44
2.1. Toán tử AND 44
2.2. Toán tử Not: ~ , ! 45
2.3. Toán tử nhân và chia: *, / 46
2.4. Toán tử chia lấy dư: % 46
2.5. Toán tử quan hệ: >=,>,<,<=,==,!= 47
2.6. Toán tử && và || 48
2.7. Toán tử ? 48
3 – Phép gán 49
3.1. Phép gán thông thường nhất như sau: 49
3.2. Phép gán thêm một giá trị là 1 49
3.3. Phép gán chuỗi 49
3.4. Phép gán thêm một với chính nó giá trị 49
4 – Phát biểu có điều kiện 50
4.1. Phát biểu IF (điều kiện) { câu lệnh; } 50
4.2. Phát biểu IF (điều kiện) { câu lệnh; }ELSE { câu lệnh; } 51
4.3. Phát biểu ELSEIF 52

4.4. Phát biểu Switch (điều kiện) 53
4.5. Phát biểu While(điều kiện) 55
4.6. Phát biểu For 55
4.7. Phát biểu do while 56
Bài 4: Biến Form 58
1. Biến form 58
1.1. Biến form từ form được submit với phương thức POST 58
1.2. Biến form từ form được submit với phương thức GET 60
2. Phương thức $HTTP_GET_VARS 65
3. Phương thức $HTTP_POST_VARS 68
Bài 5: Một số đối tượng trong PHP 71
1. Đối tượng SESSION 71
1.1. Nhận dạng Session 71
1.2. Khai báo Session 72
1.3. Lấy giá trị từ session 74
1.4. Huỷ session 78
2. COOKIE 80
Trang 3
Khoa ĐTTH – Biên soạn
Khoa ĐTTH – Biên soạn
năm 2011
năm 2011
Bài 6: Hàm và tập ]n 84
1. Khai báo hàm trong PHP 84
2. Xây dựng tập ]n định dạng nội dung 87
3. Thống nhất kích thước của mọi trang PHP 95
4. Tập ]n dùng chung 105
Bài 7: Xử lý chuỗi và mảng 109
1. Xử lý chuỗi 109
1.1. Định dạng chuỗi 109

1.2. Hàm chuyển đổi chuỗi 110
1.3. Hàm tách hay kết hợp chuỗi 112
1.4. Tìm kiếm và thay thế chuỗi 115
2. Làm việc với mảng dữ liệu 116
2.1. Mảng một chiều 116
2.2. Mảng hai chiều 118
3. Kiểu DATETIME 120
Bài 8: PHP và MySQL 124
1 – Giới thiệu cơ sở dữ liệu MySQL 124
2 – Tạo cơ sở dữ liệu và người dùng 124
3 – Kết nối cơ sở dữ liệu 126
3 – Thêm một mẩu ]n 127
4 – Cập nhật mẩu ]n 131
5 – Xóa mẩu ]n 133
6 – Truy vấn dữ liệu 135
7 – Xóa, cập nhật dữ liệu dạng mảng 137
7.1. Liệt kê dữ liệu 137
7.2. Cập nhật nhiều mẩu tin 143
Trang 4
Lập trình Web - Dùng cho hệ đào tạo CĐN CNTT
Lập trình Web - Dùng cho hệ đào tạo CĐN CNTT
Phần 1 – NGÔN NGỮ HTML
Bài 1: Tổng quan về HTML
1 – Giới Thiệu
* Internet là gì: Có thể hiểu một cách đơn giản nhất là Internet là tập hợp
các mạng nhỏ hơn như mạng LAN, WAN, thành một mạng lưới trên khắp
thế giới.
* Website: Website là một vị trí chứa trang web, một thư mục trên web
server chứa tất cả các file của một trang web. Thư mục này được gọi là root
(rễ) tức là nơi cao nhất theo phân cấp thư mục của 1 web. Cấu trúc cơ bản của

1 web như sau:
<Root>
|___index.html (trang chủ)
|___page1.html (trang 1)
|___page2.html (trang 2)
|___<Image> (thư mục chứa hình ảnh cho web)
|___
* Domain:
Domain là tên miền, chính là tên chính của 1 trang web.
hay đều là tên miền. Các tên
miền này do các Domain Server cung cấp, thường thì 1 web server luôn kèm
thêm chức năng cung cấp tên miền, nghĩa là kiêm nhiệm luôn chức năng
domain server. Nhưng không phải server nào cũng thế, một số web server
không có chức năng domain thường thấy nhất ở các web server cung cấp
forum. Thường người dùng chỉ có link dài kiểu
đây thật ra cũng là 1 domain nhưng nó quá
dài để nhớ và rất khó gõ.
Thật sự các website hay các thư mục root của bạn được định vị bằng 1
chuỗi IP riêng và duy nhất. Để truy cập vào web của bạn cần phải gõ số IP đó
vào địa chỉ nhưng do đó là 1 dãi số khá dài và khó nhớ nên domain được dùng
để thay thế dãy số phức tạp đó. Mọi việc rất đơn giản khi bạn đăng ký vào 1
domain server, domain được tạo và nó được gắn dính vào chuỗi IP định vị
root của bạn. Khi bạn truy cập domain thì thông tin được gởi lên domain
server và server này có nhiệm vụ tìm đúng số IP được gắn với domain này rồi
gởi thông tin vị trí đến web server để tải trang web về máy bạn.
Có thể hình dung như sau:
Trang 5
Khoa ĐTTH – Biên soạn
Khoa ĐTTH – Biên soạn
năm 2011

năm 2011
Máy bạn (gõ domain) =domain=> Domain server (domain=IP) =IP=> Web
server
| < < Tải web về < < |
2 – HTML là gì
HTML là viết tắt của Hyper Text Markup Language (Ngôn ngữ đánh dấu
siêu văn bản). Một tài liệu HTML thường có đuôi mở rộng là .html hoặc .htm
và tất nhiên đó là 1 trang web. Các trang HTML nói riêng và các trang web
nói chung (.php, .asp, ) có tình chất của một văn bản như các file txt hay
.doc chỉ có điều nó phức tạp và đa dạng hơn.
Các trang web HTML có thể đọc được bằng các trình duyệt web (Web
Browse) khác nhau và phổ biến nhất là Internet Explorer (IE).
Ngôn ngữ HTML có ưu điểm là rất đơn giản và có thể chạy tốt với nhiều
hệ điều hành và nhiều trình duyệt web khác nhau. Tuy mỗi trình duyệt do 1
hãng khác nhau sản xuất và có 1 cách biên dịch trang web khác nhau nhưng
nói chung đều cho 1 kết quả tương tự nhau. Ngòai ra HTML được sọan thảo
rất đơn giản, không cần chương trình chuyên dụng, chỉ cần notepad hoặc bất
kỳ chương trình sọan thảo văn bản nào. Chỉ cần save nó với định dạng .htm
hay .html, sau đây là cách save bằng notepad:
Sau khi sọan thảo nội dung HTML xong bạn chọn save nếu chưa save lần
nào hoặc save as nếu đã save nó ra file txt trước.
Trong phần Encoding chọn Unicode nếu bạn soạn trang web bằng tiếng
Việt. Phần Save as type chọn all file. Cuối cùng là phần file name chọn tên
file kèm đuôi .htm hay .html sau đó save là xong. Nếu bạn thiết kế trang chủ
thì đặt tên file là index.html vì máy chủ sẽ tự động load chính file này đầu tiên
khi ai đó truy cập trang web của bạn.
Trang 6
Lập trình Web - Dùng cho hệ đào tạo CĐN CNTT
Lập trình Web - Dùng cho hệ đào tạo CĐN CNTT
Bài 2: Ngôn ngữ HTML

1 – Các thẻ định dạng cấu trúc tài liệu
1.1. HTML thẻ định cấu trúc tài liệu
Cặp thẻ này được dử dụng để xác nhận một tài liệu HTML, tức là nó có sử
dụng các thẻ HTML để trình bày. Toàn bộ nội dung của tài liệu được đặt ở
giữa cặp thẻ này.
Cú pháp:
<HTML>
… Toàn bộ nội dung của tài liệu được đặt ở đây.
</HTML>
Trình duyệt sẽ xem các tài liệu không sử dụng thẻ <HTML> như những tập
tin văn bản bình thường.
1.2. HEAD
Thẻ HEAD được dùng để xác định phần mở đầu cho tài liệu.
Cú pháp:
<HEAD>
…. Phần mở đầu (HEADER) của tài liệu được đặt ở đây.
</HEAD>
1.3. TITLE
Cặp thẻ này chỉ có thể sử dụng trong phần mở đầu tài liệu, tức là nó phải
nằm trong phạm vi giới hạn bởi cặp thẻ <HEAD>
Cú pháp:
<TITLE> Tiêu đề của tài liệu </TITLE>
1.4. BODY
Thẻ này được sử dụng để xác định phần nội dung chính của tài liệu – phần
thân (body) của tài liệu. Trong phần thân có thể chứa các thông tin định dạng
nhất định để đặt ảnh nền cho tài liệu, màu nền, màu văn bản siêu liên kết, đặt
lề cho trang tài liệu…Những thông tin này được đặt ở phần tham số của thẻ.
Cú pháp:
<BODY>
… Phần nội dung của tài liệu được đặt ở đây

Trang 7
Khoa ĐTTH – Biên soạn
Khoa ĐTTH – Biên soạn
năm 2011
năm 2011
</BODY>
Trên đây là cú pháp cơ bản của thẻ <BODY>, tuy nhiên bắt đầu từ HTML
3.2 thì có nhiều thuộc tính được sử dụng trong thẻ <BODY>. Dưới đây là các
thuộc tính chính:
BACKGROUND= Đặt một ảnh nào đó làm ảnh nền
(background) cho văn bản. Giá trị của tham số
này (phần sau dấu bằng) là URL của file ảnh.
Nếu kích thước ảnh nhỏ hơn của sổ trình duyệt
thì toàn bộ màn hình cửa sổ trình duyệt sẽ được
phủ kín bằng nhiều ảnh.
BGCOLOR= Đặt màu nền cho trang khi hiển thị. Nếu cả
hai tham số BACKGROUND và BGCOLOR
cùng có giá trị thì trình duyệt sẽ hiển thị màu
nền trước, sau đó mới tải ảnh lên phía trên.
TEXT= Xác định màu chữ của văn bản, kể cả các đề
mục.
ALINK=, VLINK=,
LINK=
Xác định màu sắc cho các siêu liên kết trong
văn bản. Tương ứng, alink(active link) là liên
kết đang được kích hoạt – tức là khi đã được
kích chuột lên; vlink(visited link) chỉ liên kết đã
từng được kích hoạt.
Như vậy một tài liệu HTML có cấu trúc cơ bản như sau:
<HTML>

<HEAD>
<TITLE>Tiêu đề của tài liệu</TITLE>
</HEAD>
<BODY Các tham số nếu có>
Nội dung của tài liệu
</BODY>
</HTML>
Trang 8
Lập trình Web - Dùng cho hệ đào tạo CĐN CNTT
Lập trình Web - Dùng cho hệ đào tạo CĐN CNTT
2 – Các thẻ định dạng khối
2.1. Thẻ <P>
Thẻ <P> được sử dụng để định dạng một đoạn văn bản.
Cú pháp:
<P> Nội dung đoạn văn bản </P>
2.2. Các thẻ định dạng đề mục H1/H2/H3/H4/H5/H6
HTML hỗ trợ 6 mức đề mục. Chú ý rằng đề mục chỉ là các chỉ dẫn định
dạng về mặt logic, tức là mỗi trình duyệt sẽ thể hiện đề mục dưới một khuôn
dạng thích hợp. Có thể ở trình duyệt này là font chữ 14 point nhưng sang trình
duyệt khác là font chữ 20 point. Đề mục cấp 1 là cao nhất và giảm dần đến
cấp 6. Thông thường văn bản ở đề mục cấp 5 hay cấp 6 thường có kích thước
nhỏ hơn văn bản thông thường.
Dưới đây là các thẻ dùng để định dạng văn bản ở dạng đề mục:
<H1> … </H1> Định dạng đề mục cấp 1
<H2> … </H2> Định dạng đề mục cấp 2
<H3> … </H3> Định dạng đề mục cấp 3
<H4> … </H4> Định dạng đề mục cấp 4
<H5> … </H5> Định dạng đề mục cấp 5
<H6> … </H6> Định dạng đề mục cấp 6
2.3. Thẻ xuống dòng BR

Thẻ này không có thẻ kết thúc tương ứng, nó có tác dụng chuyển sang dòng
mới. Lưu ý, nội dung văn bản trong tài kiệu HTML sẽ được trình duyệt Web
thể hiện liên tục, các khoảng trắng liền nhau, các ký tự tab. Ký tự xuống dòng
đều được coi như một khoảng trắng. Để xuống dòng trong tài liệu, bạn phải
sử dụng thẻ <BR>
2.4. Thẻ PRE
Để giới hạn đoạn văn bản đã được định dạng sẵn bạn có thể sử dụng thẻ
<PRE>. Văn bản ở giữa hai thẻ này sẽ được thể hiện giống hệt như khi chúng
được đánh vào, ví dụ dấu xuống dòng trong đoạn văn bản giới hạn bởi thẻ
<PRE>
3 – Các thẻ định dạng danh sách
Cú pháp:
Trang 9
Khoa ĐTTH – Biên soạn
Khoa ĐTTH – Biên soạn
năm 2011
năm 2011
<UL>
<LI> Mục thứ nhất
<LI> Mục thứ hai
</UL>
Có 4 kiểu danh sách:
- Danh sách không sắp xếp (hay không đánh số) <UL>.
- Danh sách có sắp xếp (hay có đánh số) <OL>, mỗi mục trong danh
sách được sắp thứ tự.
- Danh sách thực đơn <MENU>
- Danh sách phân cấp <DIR>
Với nhiều trình duyệt, danh sách phân cấp và danh sách thực đơn giống
danh sách không đánh số, có thể dùng lẫn với nhau. Với thẻ OL ta có cú pháp
sau:

<OL TYPE=1/a/A/i/I>
<LI> Mục thứ nhất
<LI> Mục thứ hai
<LI> Mục thứ ba
…….
<OL>
Trong đó:
Type = 1 Các mục được sắp xếp theo thứ tự 1, 2, 3…
= a Các mục được sắp xếp theo thứ tự a, b, c…
= A Các mục được sắp xếp theo thứ tự A, B, C…
= i Các mục được sắp xếp theo thứ tự i, ii, iii…
= I Các mục được sắp xếp theo thứ tự I, II, III…
Ngoài ra còn có thuộc tính START= xác định giá trị khởi đầu cho danh
sách.
Thẻ <LI> có thuộc tính TYPE= xác định ký hiệu đầu dòng (bullet) đứng
trước mỗi mục trong danh sách. Thuộc tính này có thể nhận các giá trị: disc
(chấm tròn đậm); circle (vòng tròn); square (hình vuông).
Trang 10
Lập trình Web - Dùng cho hệ đào tạo CĐN CNTT
Lập trình Web - Dùng cho hệ đào tạo CĐN CNTT
4 – Các thẻ định dạng ký tự
4.1. Các thẻ định dạng ký tự
Dưới đây là các thẻ được sử dụng để quy định các thuộc tính in
nghiêng, in đậm, gạch chân…cho các ký tự, văn bản khi được thể hiện trên
trình duyệt.
<B> … </B>
<STRONG>… </STRONG>
In chữ đậm
<I> … </I>
<EM> … </EM>

In chữ nghiêng
<U> … </U> In chữ gạch chân
<DFN> Đánh dấu đoạn văn bản giữa hai thẻ này
là định nghĩa của một từ. Chúng thường
được in nghiêng hoặc hể hiện qua một kiểu
đặc biệt nào đó.
<S> … </S>
<STRIKE> … </STRIKE>
In chữ bị gạch ngang.
<BIG> … </BIG> In chữ lớn hơn bình thường bằng cách
tăng kích thước font hiện thời lên một. Việc
sử dụng các thẻ <BIG> lồng nhau tạo ra
hiệu ứng chữ tăng dần. Tuy nhiên đối với
mỗi trình duyệt có giới hạn về kích thước
đỗi với mỗi font chữ, vượt quá giới hạn này,
các thẻ <BIG> sẽ không có ý nghĩa.
<SMALL> … </SMALL> In chữ nhỏ hơn bình thường bằng cách
giảm kích thước font hiện thời đi một. Việc
sử dụng các thẻ <SMALL> lồng nhau tạo ra
hiệu ứng chữ giảm dần. Tuy nhiên đối với
mỗi trình duyệt có giới hạn về kích thước
đối với mỗi font chữ, vượt quá giới hạn này,
các thẻ <SMALL> sẽ không có ý nghĩa nữa.
<SUP> … </SUP> Định dạng chỉ số trên (SuperScript).
<SUB> … </SUB> Định dạng chỉ số dưới (SubScript).
<BASSEFONT> Định nghĩa kích thước font chữ được sử
dụng cho đến hết văn bản. Thẻ này chỉ có
Trang 11
Khoa ĐTTH – Biên soạn
Khoa ĐTTH – Biên soạn

năm 2011
năm 2011
một tham số size= xác định cỡ chữ. Thẻ
<BASEFONT> không có thẻ kết thúc.
<FONT> … </FONT> Chọn kiểu chữ hiện thị. Trong thẻ này có
thể đặt hai tham số size= hoặc color= xác
định cỡ chữ và màu sắc đoạn văn bản nằm
giữa hai thẻ. Kích thước có thể là tuyệt đối
(nhận giá trị từ 1 đến 7) hoặc tương đối
(+2,-4…) so với font chữ hiện tại.
4.2. Căn lề văn bản trong trang Web
Trong trình bày trang Web của mình các bạn luôn phải chú ý đến việc căn
lề các văn bản để trang Web có được một bố cục đẹp. Một số các thẻ định
dạng như P, Hn, IMG đều có tham số ALIGN cho phép bạn căn lề các văn
bản nằm trong phạm vi giới hạn bởi của các thẻ đó.
Các giá trị cho tham số ALIGN:
LEFT Căn lề trái
CENTER Căn giữa trang
RIGHT Căn lề phải
Ngoài ra, chúng ta có thể sử dụng thẻ CENTER để căn giữa trang một khối
văn bản.
Cú pháp:
<CENTER> Văn bản sẽ được căn giữa trang </CENTER>
4.3. Các ký tự đặc biệt
Ký tự & được sử dụng để chỉ chuỗi ký tự đi sau được xem là một thực
thể duy nhất. Ký tự ; được sử dụng để tách các ký tự trong một từ.
Ký tự Mã ASCII Tên chuỗi
< &#060 &lt
> &#062 &gt
& &#038 &amp

4.4. Sử dụng màu sắc trong thiết kế trang Web
Một màu được tổng hợp từ ba thành phần màu chính, đó là: Đỏ (Red),
Xanh lá cây (Green), Xanh nước biển (Blue). Trong HTML một giá trị màu là
một số nguyên dạng hexa (hệ đếm cơ số 16) có định dạng như sau:
Trang 12
Lập trình Web - Dùng cho hệ đào tạo CĐN CNTT
Lập trình Web - Dùng cho hệ đào tạo CĐN CNTT
#RRGGBB
trong đó:
RR - là giá trị màu Đỏ.
GG - là giá trị màu Xanh lá cây.
BB - là giá trị màu Xanh nước biển.
Màu sắc có thể được xác định qua thuộc tính bgcolor= hay color=. Sau dấu
bằng có thể là giá trị RGB hay tên tiếng Anh của màu. Với tên tiếng
Anh, ta chỉ có thể chỉ ra 16 màu trong khi với giá trị RGB ta có thể chỉ tới
256 màu.
Sau đây là một số giá trị màu cơ bản:
Màu sắc Giá trị Tên tiếng Anh
Đỏ #FF0000 RED
Đỏ sẫm #8B0000 DARKRED
Xanh lá cây #00FF00 GREEN
Xanh nhạt #90EE90 LIGHTGREEN
Xanh nước biển #0000FF BLUE
Vàng #FFFF00 YELLOW
Vàng nhạt #FFFFF0 LIGHTYELLOW
Trắng #FFFFFF WHITE
Đen #000000 BLACK
Xám #808080 GRAY
Nâu #A52A2A BROWN
Tím #FF00FF MAGENTA

Tím nhạt #EE82EE VIOLET
Hồng #FFC0CB PINK
Da cam #FFA500 ORANGE
Màu đồng phục hải quân #000080 NAVY
#4169E1 ROYALBLUE
#7FFFD4 AQUAMARINE
Trang 13
Khoa ĐTTH – Biên soạn
Khoa ĐTTH – Biên soạn
năm 2011
năm 2011
4.5. Chọn kiểu chữ cho văn bản
Cú pháp:
<FONT
FACE = font-name
COLOR = color
SIZE = n>
….
</FONT>
4.6. Văn bản siêu liên kết
Để tạo ra một siêu văn bản chúng ta sử dụng thẻ <A>
Cú pháp:
<A
HREF = url
NAME = name
TABINDEX = n
TITLE = title
TARGET = _blank| _seft
>


</A>
Ý nghĩa các tham số:
HREF Địa chỉ của trang web được liên kết, là một url nào đó.
NAME Đặt tên cho vị trí đặt thẻ.
TABLEINDEX Thứ tự di chuyển khi ấn phím Tab.
TITLE Văn bản hiển thị khi di chuột trên siêu liên kết.
TARGET Mở trang web được liên kết trong một cửa sổ mới
(_blank) hoặc trong cửa sổ hiện tại (_self), trong một frame (tên frame)
Trang 14
Lập trình Web - Dùng cho hệ đào tạo CĐN CNTT
Lập trình Web - Dùng cho hệ đào tạo CĐN CNTT
4.7. Kết nối mailto
Nếu đặt thuộc tính href= của thẻ <a> giá trị mailto:address@domail thì khi
kích hoạt kết nối sẽ kích hoạt chức năng thư điện tử của trình duyệt.
<ADDRESS>
Liên hệ
<A href=mailto:>
Trần Xuân Phương
</A>
</ADDRESS>
4.8. Vẽ một đường thẳng nằm ngang
Cú pháp:
<HR
ALIGN = LEFT|CENTER|RIGHT
COLOR = color
NOSHADE
SIZE = n
WIDTH = width
<HR>
Ý nghĩa các tham số:

ALIGN Căn lề (căn trái, căn phải, căn giữa)
COLOR Đặt màu cho đường thẳng
NOSHADE Không có bóng
SIZE Độ dày của đường thẳng
WIDTH Chiều dài (tính theo pixel hoặc % của bề rộng cửa sổ
trình duyệt.
5 – Thẻ chèn âm thanh và hình ảnh
5.1. Đưa âm thanh vào một tài liệu HTML
Cú pháp:
<BGSOUND
Trang 15
Khoa ĐTTH – Biên soạn
Khoa ĐTTH – Biên soạn
năm 2011
năm 2011
SRC = url
LOOP = n
>
Thẻ này không có thẻ kết thúc tương ứng (</BGSOUND>). Để chơi lặp lại
vô hạn cần chỉ định LOOP = -1 hoặc LOOP = INFINITE. Thẻ BGSOUND
phải được đặt trong phần mở đầu (tức là nằm trong cặp thẻ HEAD).
5.2. Chèn một hình ảnh, một đoạn video vào tài liệu HTML
Để chèn một file ảnh (.jpg, .gif, .bmp) hoặc video (.mpg, .avi) vào tài liệu
HTML, bạn có thể sử dụng thẻ IMG.
Cú pháp:
<IMG
ALIGN = TOP/MIDDLE/BOTTOM
ALT = text
BORDER = n
SRC = url

WIDTH = width
HEIGHT = height
HSPACE = vspace
VSPACE = hspace
DYNSRC = url
TITLE = title
START = FILEOPEN/MOUSEOVER
LOOP = n/INFINITE
>
Trong đó:
ALIGN = TOP/MIDDLE/BOTTOM
Căn hàng văn bản bao quanh ảnh
ALT = text Chỉ định văn bản sẽ được hiển
thị khi di chuyển chuột qua ảnh.
BORDER = n Đặt kích thước đường viền của
ảnh
Trang 16
Lập trình Web - Dùng cho hệ đào tạo CĐN CNTT
Lập trình Web - Dùng cho hệ đào tạo CĐN CNTT
SRC = url Địa chỉ của file ảnh cần chèn
vào tài liệu
WIDTH = width
HEIGHT= height
Chỉ định kích thước của ảnh
được hiển thị
HSPACE= vspace
VSPACE= hspace
Chỉ định khoảng trống xung
quanh hình ảnh theo bốn phía trên,
dưới, trái phải.

DYNSRC = url Địa chỉ của file video
TITLE = title Văn bản sẽ hiển thị khi con
chuột trỏ lên ảnh.
START= FILEOPEN/MOUSEOVER
Chỉ định file 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ằng 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.
6 – Chèn bảng biểu
Các thẻ tạo bảng biểu:
<TABLE> … </TABLE> Định nghĩa một bảng.
<TR> … </TR> Định nghĩa một hàng trong bảng.
<TD> … </TD> Định nghĩa một ô trong hàng.
<TH> … </TH> Định nghĩa ô chứa tiêu đề của cột.
<CAPTION> … </CAPTION> Tiêu đề của bảng.
Cú pháp
<TABLE
ALIGN = LEFT / CENTER / RIGHT
BORDER = n
BORDERCOLOR = color
BORDERCOLORDARK = color
Trang 17
Khoa ĐTTH – Biên soạn
Khoa ĐTTH – Biên soạn
năm 2011
năm 2011

BORDERCOLORLIGHT = color
BACKGROUND = url
BGCOLOR = color
CELLSPACING = cpacing
CELLPADDING = pading
>
<TR
ALIGN = LEFT/CENTER/RIGHT
VALIGN = TOP/MIDDLE/BOTTOM>
…. Định nghĩa các ô trong dòng
<TD
ALIGN = LEFT/CENTER/RIGHT
VALIGN = TOP/MIDDLE/BOTTOM
BORDERCOLOR = color
BORDERCOLORDARK = color
BORDERCOLORLIGHT= color
BACKGROUND = url
BGCOLOR = color
COLSPAN = n
ROWSPAN = n
>
…. Nội dung của ô
</TD>
</TR>
</TABLE>
Ý nghĩa các tham số:
ALIGN/VALIGN Căn lề cho bảng và nội dung trong mỗi ô
BORDER Kích thước đường kẻ chia ô trong bảng,
được đo theo pixel. Giá trị 0 cs nghĩa là
Trang 18

Lập trình Web - Dùng cho hệ đào tạo CĐN CNTT
Lập trình Web - Dùng cho hệ đào tạo CĐN CNTT
không xác định lề, giữa các ô trong bảng chỉ
có một khoảng trắng nhỏ để phân biệt. Nếu
chỉ để border thì ngầm định border=1. Với
những bảng có cấu trúc phức tạp, nên đặt lề
để người xem có thể phân biệt rõ các dòng
và cột.
BORDERCOLOR Màu đường kẻ
BORDERCOLORDARK
BORDERCOLORLIGHT
Màu phía tối và phía sáng cho đường kẻ
nổi
BACKGROUND
Địa chỉ tới tệp ảnh dùng làm nền cho
bảng
BGCOLOR Màu nền của bảng
CELLSPACING Khoảng cách giữa các ô trong bảng
CELLPADDING
Khoảng cách giữa nội dung và đường kẻ
trong mỗi ô của bảng
7 – Web Forms
7.1. HTML FORMS
Các HTML FORM có thể có các hộp văn bản, hộp danh sách lựa chọn, nút
bấm, nút chọn… cho phép người dùng có thể nhập dữ liệu, tương tác với
trang web…
7.2. Tạo FORM
Để tạo ra một form trong tài liệu HTML, chúng ta sử dụng thẻ FORM với
cú pháp như sau:
Cú pháp:

<FORM
ACTION = url
METHOD = GET | POST
NAME = name
TARGET = frame_name | _blanl | _self
>
<! Các phần tử điều khiển của form được đặt ở đây ->
Trang 19
Khoa ĐTTH – Biên soạn
Khoa ĐTTH – Biên soạn
năm 2011
năm 2011
<INPUT…>
<INPUT…>
</FORM>
Trong đó
ACTION Địa chỉ sẽ gửi dữ liệu tới khi form được
submit (có thể là địa chỉ tới một chương trình
CGI, một trang ASP, PHP…>
METHOD Phương thức gửi dữ liệu
NAME Tên của form
TARGET Chỉ định cửa sổ sẽ hiển thị kết quả sau khi
gửi dữ liệu từ form đến server
7.3. Đặt các đối tượng điều khiển (như hộp văn bản, ô kiểm tra, nút
bấm…)
Cú pháp thẻ INPUT:
<INPUT
NAME = “Tên input”
ALIGN = LEFT | CENTER | RIGHT
TYPE = BUTTON | CHECKBOX | FILE | IMAGE |

PASSWORD | RADIO | RESET | SUBMIT | TEXT
VALUE = value
>
7.4. Tạo một danh sách lựa chọn
Cú pháp:
<SELECT NAME = “tên danh sách” SIZE = “chiều cao”>
<OPTION VALUE=value1 SELECTED> Tên mục chọn thứ nhất
</OPTION>
<OPTION VALUE=value2> Tên mục chọn thứ hai </OPTION>
<! Danh sách các mục chọn >
</SELECT>
Trang 20
Lập trình Web - Dùng cho hệ đào tạo CĐN CNTT
Lập trình Web - Dùng cho hệ đào tạo CĐN CNTT
7.5. Tạo hộp soạn thảo văn bản
Cú pháp:
<TEXTAREA
COLS = số cột
ROWS = số hàng
NAME = tên
>
Văn bản ban đầu
</TEXTAREA>
Trang 21
Khoa ĐTTH – Biên soạn
Khoa ĐTTH – Biên soạn
năm 2011
năm 2011
Phần 2 – LẬP TRÌNH WEB VỚI PHP
Bài 1: Tổng quan về PHP

1 – Giới thiệu PHP
PHP viết tắt của chữ Personal Home Page ra đời năm 1994 do phát minh
của Rasmus Lerdorf, và nó tiếp tục được phát triển bởi nhiều cá nhân và tập
thể khác, do đó PHP được xem như một sản phẩm của mã nguồn mở.
PHP là kịch bản trình chủ (server script) chạy trên phía server (server side)
như cách server script khác (asp, jsp, cold fusion).
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 mọi cơ sở dữ liệu như mySQL,
PostgreSQL, Oracle, SQL Server và Access.
Lưu ý rằng, từ phiên bản 4.0 trở về sau 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ì vậy bạn có thể sử
dụng PHP có những yêu cầu về xử lý chuỗi.
2 – Cài đặt PHP
Cài đặt PHP trên nền Windows thì sử dụng php-4.0.6-Win32.zip (hoặc mới
hơn), sau khi cài đặt ứng dụng này trên đĩa cứng sẽ xuất hiện thư mục PHP,
trong thự mục này sẽ có tập tin php4ts.dll và php.exe cùng với thư mục
sessiondata.
Ngoài ra, trong thư mục WINDOW hoặc WINNT sẽ xuất hiện tập tin
php.ini, tập tin này cho phép bạn cấu hình cho ứng dụng PHP. Chẳng hạn, khi
sử dụng session, PHP cần một nơi để lưu trữ chúng, trong tập tin này mặc
định là session.save_path =C:\PHP\sessiondata, nếu bạn cài đặt PHP với thư
mục PHP trên đĩa D thì bạn cần thay đổi đường dẫn trong khai báo này.
Tương tự như vậy, khi có lỗi trong trang PHP thì lỗi thường xuất hiện khi
triệu gọi chúng, để che dấu các lỗi này thì bạn cần khai báo display_errors =
Off thay vì chúng ở trạng thái display_errors = On.
Ngoài ra, trang PHP cũng có thể trình bày một số warning khi chúng phát
hiện cú pháp không hợp lý, chính vì vậy để che dấu các warning này thì bạn
cũng cần khai báo trạng thái Off thay vì On như assert.warning = Off.
3 – Cấu hình ứng dụng PHP
Cài đặt Vertrigo Web Server. Để cài đặt Vertrigo Web Server, thực theo

các bước sau
1. Tải tập tin Vertrigo.exe từ địa chỉ:
Trang 22
Lập trình Web - Dùng cho hệ đào tạo CĐN CNTT
Lập trình Web - Dùng cho hệ đào tạo CĐN CNTT
/>224.exe
2. Chạy tập tin này và cài đặt lên đĩa C:\, sau khi kết thúc thành công phần
cài đặt Vertrigo, bạn bắt đầu cấu hình ứng dụng PHP.
3. Sau khi kết thúc thành công phần cài đặt Vertrigo Server, bạn có thể cấu
hình ứng dụng php tại địa chỉ http://localhost/. Cửa sổ giao diện Vertrigo
Server có dạng như hình sau.
Hình 1–1: Màn hình ứng dụng Vertrigo
4. Toàn bộ các tập tin php được đặt tại thư mục có đường dẫn
C:\VertrigoServ\www\
5. Viết trang test.php với nội dung <?php echo "hello";?>
6. Chép tập tin test.php vào thư mục C:\VertrigoServ\www\
7. Sau đó gõ trên trình duyệt http://localhost/test.php. Kết quả thu được như
hình 1-2:
Trang 23
Khoa ĐTTH – Biên soạn
Khoa ĐTTH – Biên soạn
năm 2011
năm 2011
Hình 1–2: Kết quả file test.php
4 – Giới thiệu PHP
4.1. Yêu cầu
PHP dựa trên cú pháp của ngôn ngữ lập trình C, chính vì vậy khi làm việc
với PHP bạn phải là người có kiến thức về ngôn ngữ C, C++, Visual C. Nếu
bạn xây dựng ứng dụng PHP có kết nối cơ sở dữ liệu thì kiến thức về cơ sở dữ
liệu MySQL, SQL Server hay Oracle là điều cần thiết.

4.2. Giới thiệu
PHP là kịch bản trình chủ (Server Script) được chạy trên nền PHP Engine,
cùng với ứng dụng Web Server để quản lý chúng. Web Server thường sử
dụng là IIS, Apache Web Server,
4.3. Thông dịch trang PHP
Khi người sử dụng gọi trang PHP, Web Server triệu gọi PHP Engine để
thông dịch (tương tự như ASP 3.0 chỉ thông dịch chứ không phải biên dịch)
dịch trang PHP và trả về kết quả cho người sử dụng như hình 1-3.
Trang 24
Lập trình Web - Dùng cho hệ đào tạo CĐN CNTT
Lập trình Web - Dùng cho hệ đào tạo CĐN CNTT
Hình 1 – 3 Quá trình thông dịch trang PHP
4.4. Kịch bản (script)
Nội dung của PHP có thể khai báo lẫn lộn với HTML, chính vì vậy bạn sử
dụng cặp dấu giá <?=trị/biểu thức/biến?> để khai báo mã PHP. Chẳng hạn,
chúng ta khai báo:
<br>
1 – Giá trị biến Str: <?=$groupid ?>
2 – Giá trị biến I: <?=$i?>
3 – Giá trị cụ thể: <?=10?>
Chẳng hạn bạn khai báo trang hello.php với nội dung như ví dụ 1-1 sau:
Ví dụ 1-1: Trang hello.php
<HTML>
<HEAD>
<TITLE>::Welcome to PHP</TITLE>
Trang 25

×