mở đầu và kết thúc. HTML không phân biệt chữ HOA/thường, ví dụ <HTML> và <html> là như nhau.Ta nên dùng chữ thường khi viết các thẻ và không để khoảng cách giữa các ký tự trong thẻ. Nội dung của một trang Web được viết bằng ngôn ngữ HTML luôn đặt trong cặp thé <html> </html>. Trang Web gom 2 phan chinh: - Dau trang, nằm trong cặp thé <head> </head> - Thân, nằm trong cặp thé <body> </body> SVTH: 22 c# .®ấ: hang 11 Thitt bt wab site tự hee mon Áda hoe lop !r trink phan ban thi difm GVHD: FS.
Trinh ám Biéu Phan head dùng dé chứa một số thông tin vẻ trang Web khi cần thiết như tiêu dé trang Web, nội dung ma WebBrowser hiển thị chỉ nằm trong phan body. Ví dụ: <html> <head> nội dung trang Web </body> </hưnl> 1. Các thẻ cơ bản trong HTML a. Các thẻ cấu trúc HTML bao gồm 3 thẻ dé xác định cấu trúc của trang Web bao gồm: - <html> </htmÌ> - <head> </head> - <body> </body> b.
Các thé định dang văn bản Mặc dù có rất nhiều thẻ đề định dạng văn bản, những thẻ sau đây là những thẻ cơ bản nhất mà gần như bắt cứ một trang Web nào cũng phải sử dụng: - <p>: Khai báo một đoạn văn bản, chèn kí tự xuống dòng và một dòng trồng. - <br>: Khai báo ngắt dòng. - Các đề mục: <hl> </hI> : Định dạng dòng văn bản giữa cặp thé này ở dạng đề mục cấp 1. <h2> </h2> : Dinh dạng dong văn bản giữa cặp thẻ này ở dạng đề mục cấp 2.
SVTH: 22 A _®á: Trang 12 "Thitt ke wah site ty hoe min hia how Lip 1) sương trink phan ban thi đa GVHD: TS. C7nuắ am Biéu c. Định dang Text Định dang kiểu chữ: - <b> </b> : Nội dung nằm giữa các thẻ được in đậm. - <u> </u> : Nội dung nằm giữa các thẻ được gạch dưới.
- <i> </i> : Nội dung nằm giữa các thẻ được in nghiêng. - <strong></strong> : Nội dung nằm giữa các thẻ được in đậm ở hau hết man hình trình duyệt. - <small> </small> ; Giảm cỡ chữ văn bản với một giá trị do trình duyệt xác định. - <big> </big> : Tăng cỡ chữ văn bản với một giá trị do trình duyệt xác định.
- <sub> </sub> : Dinh dạng chỉ số dưới. - <sup> </sup> : Định dạng chỉ số trên. Font chữ, cỡ chữ, mau sắc và canh lê - <font face=".</font> - <p align="lefU/right/center"> 1. Liên kết các trang web HTML dùng thé <a> </a> dé tao liên kết tới một trang Web.
- <a href= “file name.*”>local link </a> : Tạo liên kết tai chỗ ding dja chi tương đối. - <a href= “file://C:/path/filename”>local link></a> : Tạo liên kết tại chỗ dùng địa chỉ tuyệt đối. - <a href= “http://URL”>remote link</a> : Tạo liên kết từ xa VD: Liên kết tới địa chỉ Email <a href="mailto:quocdung82ly@yahoo. Danh sách (list) Danh sách gồm 2 loại: có thứ tự và không có thứ tự.
Trong HTML, mỗi mục trong danh sách được bắt đầu bằng thẻ <li>. Các mục trong danh sách lại được đặt trong một thẻ danh sách. HTML có các thẻ danh sách: SVTH: 2 c# .®fđ¿ Trang 13 Thitt hi web site tu hoe man hia hoe Lap 1 vhaamy trinh phan baw the diễn GVHD: TS. Trink Odn Bidu - <ol>: ordered list - danh sách có thứ tự.
- <ul>: unordered list - danh sách không có thứ tự. - <menu>: danh sách dạng menu. - <dir>: directory - danh sách thư mục. VD: <!--Danh sách có thứ tự --> <p> <ol> <li> Tiéng Anh chuyén nganh thu ki trén hé multimedia.
<li> Điện toán văn phòng <li> Tổ chức và quản trị học <li> Viễn thông </ol> </p> Kết quả hiển thị : 1. Tiếng Anh chuyên ngành thư kí trên hệ multimedia. 2, Điện toán văn phòng 3. Tổ chức và quản trị học 4.
Bảng (table) HTML sử dung một bộ cấu trúc thẻ gồm có <table>, <tr> va <td> dé định dạng các bảng. <table> <tr> KG TT 001 101777.7 1112717 10717/17717,77 </td > = ea 9117710779511 ery pre are Pee </td> </tr> <tr> <P ere <td> SVTH: 2 cA Mi Trang 14 Thitt bt web vữa bự hoe mim hia hoe Lop vý trink phan ban thi dle GVHD: FS. Trink “án Biéu </tr> </table> - <table>: phần nằm trong thé là một cấu trúc các dòng và các cột của bảng. - <tr> - Table row: phần nằm trong thé là cấu trúc các cột của một đòng - <td > - Table data: phần nằm trong thẻ là nội dung của một cell ( một cột của một dong).
Chú ý - Đặt thuộc tinh Border, BorderColor, BGColor cho thẻ <table> : đặt độ dày đường viễn, màu nên đường vién và màu nén của bảng. - Mỗi cột có độ rộng đủ để chứa nội dung bên trong nếu không đặt giá trị cho thuộc tính width của <table>. Tạo ô có nhiều hàng/cột - <td Colspan= #></td> : ô chiếm # hàng - <td Rowspan= #></td> : ô chiếm nhiều cột b. Dinh chiều cao, chiều rộng của 6 <td width= # height= #></td> : định chiều rộng, chiều cao 6 là # pixel c.
CellSpacing và CellPadding <table CellSpacing= # CellPadding= #></table> - CellSpacing :chi định khoảng cách cach giữa các Cell. ~- CellPadding: chỉ định khoảng cách từ biên cua cell tới nội dung trong Cell. Canh lề nội dung của 6 - <td align=alignment></td> : canh lề nội dung của ô theo hàng ngang (LEFT, RIGHT, CENTER) - <td valign=valignment></td> : canh lề nội dung của ô theo chiều thăng đứng (TOP, BOTTOM, MIDDLE) - <tr align=alignment></tr> : canh lề theo chiều ngang nội dung của tat cả các ô trên một hảng (LEFT, RIGHT, CENTER) SVTH: 22 A Mébi Feang 15 Thitt ki web site ty hoo mon hia hoe lap 1 chuamg trink phan ban thi didm GVHD: TS. Trink Oan “Điêu - <tr valign=valignment></tr> : canh lề theo chiều thẳng đứng nội dung của tat ca các 6 trên một hàng (TOP, BOTTOM, MIDDLE) e.
Đặt liên kết vào ô Lông cặp thẻ liên kết <a href></a> vào trong cặp thẻ khai báo ô<td></td> Sf. Đặt hình ảnh vào 6 Lồng cặp thẻ <img sre> trong cặp thẻ <td></td> 1. HTML Form Một web site tinh thường chỉ có những trang web với các van ban va hình ảnh. Mặc dù đem lại cho người học nhiều thông tin, điểm hạn chế nhất là web site hoàn toàn không quan tâm tới người sử dụng là ai, đã từng truy cập tới web site bao giờ chưa,.
Cac web site ngay nay đã không còn dừng lại ở mức độ đó, vượt xa hơn, chúng là những ứng dụng web có khả năng xác định người học thông qua tên người học và mật khẩu, cho phép bạn gửi và nhận các thông tin phản hồi, gửi nhận tin trong các Forum. Đề làm điều này, công cụ đầu tiên cần phải có là các Form trên trang Web cho phép người học nhập thông tin. Trong phần này trình bày các kiến thức về HTML Form. Dé cho phép người học nhập dit liệu vào trang web, HTML cung cấp các thẻ để xây dựng Form nhập liệu.
Dé tạo một Form, ta sử dung thẻ <form></form>.Dé phân biệt Form này với Form kia, ta gắn giá trị cho thuộc tính name của Form. 3 thẻ cơ bản trong Form dé tạo các điều khiển là: - <input>: Dùng để tao Button, TextBox, CheckBox. - <textarea>: Tao TextBox nhiều dong, nhiéu cét. - <select>: Tao ComboBox va ListBox.
Các điều khiển cơ bản - thẻ <input> Hầu hết các điều khiển cơ bản trong <form> đều được tạo bằng thẻ <input>, cấu trúc của thẻ <input> như sau: <input type=" loại điều khiển" name="."> SVTH: 22 cA Méi Trang 16 Thitt ki web site tu hoe man hda hoe Cap 11 s6 dơng trink phan ban thi didm GVHD: FS. Feink Van Biéu Type: loại điều khiển muốn tạo. Gồm 6 loại điều khién là: - Textbox - Radio button - CheckBox - OptionBox - Button - Submit/Reset. Name: tên của điều khiển Value: chuỗi văn bản hiển thị trên điều khién.
Vùng nhập liệu - thẻ <textarea> <textarea rows=".">N6i dung</textarea> - Thuộc tinh cols,rows dùng dé xác định kích thước của textbox. ComboBox và ListBox <select size="."> <option> muc chon | </option> <option selected> myc chọn 2 </option> </select> -Thuộc tinh size giúp cho WebBrowser xác định điều khiển là ComboBox (size="1") hay ListBox ( size>1). -Thé <option> được đặt trong cặp thé <select> dé định nghĩa các mục chọn. Qúa trình xử lý Form Việc xử lý Form có thể chia làm 2 bước, tại Client và tại Server.
Người lập trình sẽ phải sử dụng một ngôn ngữ gọi là Script dé đọc và xử lý giá trị của các điều khiển trong Form. -Ng6n ngữ Script xử ly Form tai Client gọi là Client Side Script. -Ng6n ngữ Script xử ly Form tai Server gọi là Server Side Script. SVTH: 22 c# Méi Feang 17 Thiet Ke swab site ty hoe min hia hyo lap 11 shamg kủaŠ phan ban thi đa GVHD: FS.
C7zjm& an Điều 1. NGON NGỮ LAP TRÙNH JAVACRIPT 1. Giới thiệu về javascript Ngôn ngữ javascript được tạo ra bởi Netscape vào năm 1996 và được đưa vào trong trình duyệt Netscape Navigator 2.0 thông qua một trình biên dịch dé đọc và thực hiện các mã lệnh javascript được kèm theo trong các trang. Hiện nay, Javascript là một ngôn ngữ kịch bản số một dành cho trình duyệt.
Công nghệ nay còn được dùng dé lập trình cho các tập tin PDF va lập trình máy chủ web. Uu nhược diém của javascript - Ưu điểm : Javascript có khả năng chạy trên nhiều trình duyệt, kiểm tra tính hợp lệ của dữ liệu, và khả năng tạo ra giao diện người học tỉnh tế và phức tạp. Các hiệu ứng tạo ra bởi javascript có thể được tải nhanh hơn rất nhiều so với các công nghệ như flash và java applets. Ngoài ra, không cần phải có công cụ riêng biệt dé viết javascript, bạn có thé sử dụng bắt kì trình soạn thảo văn bản hoặc html nào để thực hiện việc đó.
- Nhược điểm : Cũng như các với phần lớn sự phát triển web, javascript phụ thuộc tính tương thích của trình duyệt. Nếu lập trình javascript trong một trang web không can thận rat dé tạo ra sự không nhất quán và làm hỏng trang web một cách không ý thức. Javascript trong mỘt trang web Một trình duyệt web sẽ “biên dich” mã lệnh bằng cách chuyển nó sang dạng mà máy tính có thể hiểu được và sau đó sẽ thực hiện mã lệnh. Chúng ta sử dụng thẻ <script></script> dé báo cho trình duyệt biết rằng các dòng nằm phía trong hai thẻ này cần được biên dịch như là các mã javascript chứ không phải là HTML hoặc văn bản.
Chúng ta có thể đặt các khối mã javascript bất kì nơi nảo trong trang web và có thé đặt ở nhiều nơi khác nhau. SVTH: HE A MBit Trang 18 Thutt ke wal site ty hos man héa kee Lap 11 chiumg trink phan ban th didm GVHD: FS. Trinh Odn Biéu c.