Bài tập thực hành môn lập trình PHP
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 (2.07 MB, 18 trang )
GVHD:
Email:
Website:
Dương Khai Phong
1. Yêu cầu phần mềm thực hành
2. Hướng dẫn sử dụng phần mềm
3. Bài tập tại lớp
4. Bài tập về nhà (nộp chấm điểm)
1. Cài đặt và Cấu hình XAMPP
Port kết nối của Apache và MySQL
(có thể cấu hình lại trong phần Config
khi có xung đột Port)
Gói cài đặt XAMPP chỉ cài đặt thành
công khi Apache và MySQL đều được
Start
2. Kiểm tra cài đặt XAMPP
Mở trình duyệt web, kiểm
tra gói cài đặt bằng cách
nhập địa chỉ theo 2 cách
sau:
localhost:8080/
127.0.0.1:8080/
Kiểm tra phpMyAdmin
3. Triển khai ứng dụng web “Hello world” bằng DW CS5
Bước 1: vào menu: Sites / Manage Sites
Bước 2: chọn New để tạo một dự án Website
mới.
3. Triển khai ứng dụng web “Hello world” bằng DW CS5
Bước 3: cấu hình các thông số cho mục Site
Đặt tên website
Thư mục lưu website
(Lưu ý: nên lưu website trong thư
mục cài đặt htdocs của gói xampp)
Vd: C:\xampp\htdocs\mywebsite
3. Triển khai ứng dụng web “Hello world” bằng DW CS5
Bước 4: cấu hình các thông số cho mục Servers
(chọn mục Servers như hình ở Bước 3)
Server Name và Server Folder đặt tên như ở
Bước 3
Chọn Local/Network
Nhập địa chỉ theo như phần cấu hình đã cài đặt XAMPP
Vd: http://localhost:8080/TH_PHP_HTML_CSS/index.php
3. Triển khai ứng dụng web “Hello world” bằng DW CS5
Bước 5: tạo mới tập tin index.php như hình sau
Bước 6: thực thi kiểm tra (vào File / Preview in
Browser hoặc nhấn F12)
Bài 01a: sử dụng Nodepad để làm quen với các thẻ HTML:
_Sử dụng thẻ <Title> để đặt tiêu đề “Introduction of Cats”
_Thẻ <body> sử dụng thuộc tính bgcolor=“yellow”
Sử dụng thẻ
để chèn
nội dung tiêu đề
“Các mèo của
năm”
Sử
dụng
thẻ
<img> để chèn
hình ảnh trong thư
mục images của
Bai01
Bài 01b: sử dụng Nodepad để làm quen với các thẻ HTML:
_Sử dụng thẻ <Title> để đặt tiêu đề “Introduction of Cats”
_Thẻ <body> sử dụng thuộc tính bgcolor=“yellow”
Sử dụng thẻ để chèn nội
dung tiêu đề “Các mèo của
năm”
_Sử dụng thẻ <img> với
thuộc tính width=“120px” để
chèn hình ảnh trong thư mục
images của Bai01
_Thẻ
để xuống dòng.
Bài 02a: sử dụng Nodepad để làm quen với các thẻ bảng biểu:
Xác định số dòng, số cột của bảng (ví dụ: 3 dòng, 4 cột)
Bảng sử dụng các thuộc tính:
• <Table>: có thuộc tính background=“bg.jpg”, border=“1px”, width=“550px”
và align=“center” (hình ảnh trong thư mục images của Bai02)
• <Tr>: có thuộc tính align=“Center”
• <Td>: của dòng 1 có thuộc tính Colspan=“4”
Bài 02b: sử dụng Nodepad để làm quen với các thẻ bảng biểu:
Xác định số dòng, số cột của bảng (ví dụ: 4 dòng, 3 cột)
Bảng sử dụng các thuộc tính:
• <Table>: có thuộc tính background=“bg.jpg”, border=“1px”, width=“550px”
và align=“center” (hình ảnh trong thư mục images của Bai02)
• <Tr>: có thuộc tính align=“Center”
• <Td>: của cột 2,dòng 1 có thuộc tính rowspan=“4”
Thẻ <img> có thuộc tính width=“150px”
Bài 03: sử dụng hình ảnh trong thư mục images Bai03 để thiết kế các trang sau:
Bài 04a: sử dụng Nodepad để thiết kế các form theo các trang sau:
input type="text"
input type="text"
input type="button"
input type="text"
Bài 04b: sử dụng Nodepad để thiết kế các form theo các trang sau:
input type="text"
input type="button"
Bài 05: sử dụng CSS và Div, thiết kế lại trang hiển thị thông tin thời khoá biểu như
sau:
Hình thức nộp bài qua email:
Tiêu đề email (subject): BTTH_Buoi01_MaSV1_MaSV2
Nội dung email ghi rõ: họ tên nhóm sinh viên và lớp
Nén các tập tin bài tập thành *.rar và đặt tên
BTTH_Buoi01_MaSV1_MaSV2.rar
Thời hạn nộp bài: trước ngày 04/10/2012
Sinh viên hoàn tất thiết kế các bài tập sau bằng CSS và Div
1. Trang chủ />2. Trang chủ />3. Trang chủ />4. Trang chủ />
dung tiêu đề “Các mèo của
năm”
_Sử dụng thẻ <img> với
thuộc tính width=“120px” để
chèn hình ảnh trong thư mục
images của Bai01
_Thẻ
để xuống dòng.
Bài 02a: sử dụng Nodepad để làm quen với các thẻ bảng biểu:
Xác định số dòng, số cột của bảng (ví dụ: 3 dòng, 4 cột)
Bảng sử dụng các thuộc tính:
• <Table>: có thuộc tính background=“bg.jpg”, border=“1px”, width=“550px”
và align=“center” (hình ảnh trong thư mục images của Bai02)
• <Tr>: có thuộc tính align=“Center”
• <Td>: của dòng 1 có thuộc tính Colspan=“4”
Bài 02b: sử dụng Nodepad để làm quen với các thẻ bảng biểu:
Xác định số dòng, số cột của bảng (ví dụ: 4 dòng, 3 cột)
Bảng sử dụng các thuộc tính:
• <Table>: có thuộc tính background=“bg.jpg”, border=“1px”, width=“550px”
và align=“center” (hình ảnh trong thư mục images của Bai02)
• <Tr>: có thuộc tính align=“Center”
• <Td>: của cột 2,dòng 1 có thuộc tính rowspan=“4”
Thẻ <img> có thuộc tính width=“150px”
Bài 03: sử dụng hình ảnh trong thư mục images Bai03 để thiết kế các trang sau:
Bài 04a: sử dụng Nodepad để thiết kế các form theo các trang sau:
input type="text"
input type="text"
input type="button"
input type="text"
Bài 04b: sử dụng Nodepad để thiết kế các form theo các trang sau:
input type="text"
input type="button"
Bài 05: sử dụng CSS và Div, thiết kế lại trang hiển thị thông tin thời khoá biểu như
sau:
Hình thức nộp bài qua email:
Tiêu đề email (subject): BTTH_Buoi01_MaSV1_MaSV2
Nội dung email ghi rõ: họ tên nhóm sinh viên và lớp
Nén các tập tin bài tập thành *.rar và đặt tên
BTTH_Buoi01_MaSV1_MaSV2.rar
Thời hạn nộp bài: trước ngày 04/10/2012
Sinh viên hoàn tất thiết kế các bài tập sau bằng CSS và Div
1. Trang chủ />2. Trang chủ />3. Trang chủ />4. Trang chủ />
