CHƯƠNG 1 : CƠ SỞ LÝ THUYẾT 1. Giới thiệu về đề tài Việc kinh doanh mua bán là nhu cầu không thể thiếu đối với mọi chúng ta. Trong thời đại cạnh tranh hiện nay việc giới thiệu sản phẩm kinh doanh đến từng cá nhân với chi phí thấp, hiệu quả cao là một vấn đề nan giải của người kinh doanh cùng với nhu cầu mua sắm với những sản phẩm đa chủng loại, đạt chất lượng, và hợp túi tiền của người tiêu dùng vì vậy thương mại điện tử đã được ra đời và dần dần phát triển trên toàn thế giới. Việc phổ biến các sản phẩm của cửa hàng kinh doanh đến khách hàng thông qua các bảng báo giá tuy nhiên chi phí khá cao vì số lượng sản phẩm ngày một đa dạng và giá cả thay đổi liên tục và tính phổ biến không cao chưa đáp ứng được nhu cầu người dùng.
Mặt khác của hàng còn gặp nhiều khó khăn như chưa quản lý được người dùng, thông tin nhà sản xuất, cập nhật giá sản phẩm, quản lý sản phẩm. Nắm bắt được tình hình trên em tiến hành thiết kế trang web mua bán hàng online để mong sao giúp cho các cửa hàng phát triển nhanh hơn, giúp cho chủ cửa hàng có thể quản lý cửa hàng của mình một cách tốt hơn. Giới thiệu các ngôn ngữ lập trình 1. Ngôn ngữ HTML Ngôn ngữ HTML (HyperText Markup Language – ngôn ngữ siêu văn bản) là một trong các loại ngôn ngữ được sử dụng trong lập trình web.
Khi truy cập một trang web cụ thể là click vào các đường link, bạn sẽ được dẫn tới nhiều trang các nhau và các trang này được gọi là một tài liệu HTML (tập tin HTML). Một trang HTML như vậy được cấu thành bởi nhiều phần tử HTML nhỏ và được quy định bằng các thẻ tag. Bạn có thể phân biệt một trang web được viết bằng ngôn ngữ HTML hay PHP thông qua đường link của nó. Ở cuối các trang HTML thường hay có đuôi là HTML hoặc HTM.1: Mô hình của HTML Một trang HTML được cấu thành bởi nhiều phần tử HTML nhỏ và được quy định bằng các thẻ tag.
HTML là ngôn ngữ lập trình web được đánh giá là đơn giản. Mọi trang web, mọi trình duyệt web đều có thể hiển thị tốt ngôn ngữ HTML. Hiện nay, phiên bản mới nhất của HTML là HTML 5 với nhiều tính năng tốt và chất lượng hơn so với các phiên bản HTML cũ. Vậy, đối với các website, ngôn ngữ HTML đóng vai trò như thế nào? HTML, theo đúng nghĩa của nó, là một loại ngôn ngữ đánh dấu siêu văn bản, thế nên các chức năng của nó cũng xoay quanh yếu tố này.
Cụ thể, HTML giúp cấu thành các cấu trúc cơ bản trên một website (chia khung sườn, bố cục các thành phần trang web) và góp phần hỗ trợ khai báo các tập tin kĩ thuật số như video, nhạc, hình ảnh.2: Mô hình hoạt động JavaScript, CSS, HTML Ưu điểm nổi trội nhất và cũng là thế mạnh của HTML là khả năng xây dựng cấu trúc và khiến trang web đi vào quy cũ một hệ thống hoàn chỉnh. Nếu bạn mong muốn sở hữu một website có cấu trúc tốt có mục đích sử dụng nhiều loại yếu tố 4 trong văn bản, hãy hỏi HTML. Nhiều ý kiến cho rằng tùy theo mục đích sử dụng mà lập trình viên hay người dùng có thể lựa chọn ngôn ngữ lập trình riêng cho website của bạn, tuy nhiên thực chất HTML chứa những yếu tố cần thiết mà dù website của bạn có thuộc thể loại nào, giao tiếp với ngôn ngữ lập trình nào để xử lý dữ liệu thì nó vẫn phải cần đến ngôn ngữ HTML để hiển thị nội dung cho người truy cập. Nói đúng hơn, dù website của bạn được xây dựng như thế nào, trên nền tảng nào thì nó cũng cần đến sự hỗ trợ của HTML, dù ít dù nhiều.
Đối với các lập trình viên hay nhà phát triển web, họ đều phải học HTML như một loại ngôn ngữ cơ bản trước khi bắt tay vào thiết kế trang web nào. Cấu trúc cơ bản của một trang HTML Cấu trúc cơ bản của HTML Cấu trúc cơ bản của trang HTML/XHTML có dạng như sau, thường gồm 3 phần: <!Doctype>: Phần khai báo chuẩn của html hay xhtml. <head></head>: Phần khai báo ban đầu, khai báo về meta, title, CSS, javascript. <body></body>: Phần chứa nội dung của trang web, nơi hiển thị nội dung.
Cấu trúc cơ bản <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 3.4 Transitional//EN" "http://www.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <title>Tiêu đề trang web</title> </head> <body> .Phần thân viết ở đây. </body> </html> Cấu trúc cơ bản của trang web Mỗi trang web đều có cách thể hiện cấu trúc khác nhau, có trang 1 cột, có trang 2 và cũng có trang chứa nhiều cột, bên dưới đây chúng ta tham khảo một trang đơn giản sử dụng 2 cột để layout. 5 Phần đầu: header, có thể chứa logo, câu slogan, các liên kết, các banner liên kết, các button, đoạn flash, hoặc các form ngắn như form tìm kiếm. Phần liên kết toàn cục: global navigation, dùng để chứa các liên kết đến những trang quan trọng trong toàn bộ trang, trong phần này có thể chứa thêm các liên kết con (Sub Navigation).
Phần thân của trang: page body, phần này chứa phần nội dung chính (Content) và phần nội dung phụ (Sidebar). Phần nội dung chính: content, phần này chứa nội dung chính cần thể hiện cho người dùng xem. Phần nội dung phụ: sidebar, phần này có thể chứa liên kết phụ của từng trang (Local Navigation), hoặc các banner chứa liên kết liên quan, hoặc có thể dùng để chứa các liên kết quảng cáo. Phần cuối trang web: footer, phần này thường chưa phân liên hệ như: tên công ty, địa chỉ, số điện thoại, mail liên hệ,.
và đặc biệt là copyright, hoặc có thể chứa các liên kết toàn trang, các banner liên kết.3: Mô hình cấu trúc cơ bản của trang HTML 6 1. Các thẻ HTML cơ bản • Thẻ <head>.</head>: Tạo đầu mục trang • Thẻ <title>.</title>: Tạo tiêu đề trang trên thanh tiêu đề, đây là thẻ bắt buộc. Thẻ title cho phép bạn trình bày chuỗi trên thanh tựa đề của trang Web mỗi khi trang Web đó được duyệt trên trình duyệt Web. • Thẻ <body>…</body>: Tất cả các thông tin khai báo trong thẻ <body> đều có thể xuất hiện trên trang Web.
Những thông tin này có thể nhìn thấy trên trang Web. • Các thẻ định dạng khác.</p>: Tạo một đoạn mới.</font>: Thay đổi phông chữ , kích cỡ và màu kí tự. • Thẻ định dạng bảng <table>.<table>: Đây là thẻ định dạng bảng trên trang Web. Sau khi khai báo thẻ này, bạn phải khai báo các thẻ hàng <tr> và thẻ cột <td> cùng với các thuộc tính của nó.
• Thẻ hình ảnh <img>: Cho phép bạn chèn hình ảnh vào trang Web. Thẻ này thuộc loại thẻ không có thể đóng. • Thẻ liên kết <a>.</a>: Là loại thẻ dùng để liên kết giữa các trang Web hoặc liên kết đến địa chỉ Internet, Mail hay Intranet (URL) và địa chỉ trong tập tin trong mạng cục bộ (UNC). Bạn đã gửi Hôm nay lúc 13:39 • Các thẻ Input: Thẻ Input cho phép người dùng nhập dữ liệu hay chỉ thị thực thi một hành động nào đó, thẻ Input bao gồm các loại thẻ như: text, password, submit button, reset, checkbox, radio, image.
• The Textarea: <Textarea>.<\Textarea>: The Textarea cho phép người dùng nhập liệu với rất nhiều dòng. Với thẻ này bạn không thể giới hạn chiều dài lớn nhất trên trang Web. • Thẻ Select: Thẻ Select cho phép người dùng chọn phần tử trong tập phương thức đã được định nghĩa trước. Nếu thẻ Select cho phép người dùng chọn một phần tử trong danh sách phần tử thì thẻ Select sẽ giống như combobox.
Nếu thẻ Select cho phép người dùng chọn nhiều phần tử cùng một lần trong danh sách phần tử, thẻ Select đó là dạng listbox. • Thẻ Form: Khi bạn muốn submit dữ liệu người dùng nhập từ trang web phía Client 7 lên phía Server, bạn có hai cách để làm điều nàu ứng với hai phương thức POST và GET trong thẻ form. Trong một trang Web có thể có nhiều thẻ Form khác nhau, nhưng các thẻ Form này không được lồng nhau, mỗi thẻ form sẽ được khai bảo hành động (Action) chỉ đến một trang khác. Ngôn ngữ CSS 1.1 Định nghĩa CSS CSS là viết tắt của Cascading Style Sheets.
Đây là một ngôn ngữ style sheet được sử dụng để mô tả giao diện và định dạng của một tài liệu viết bằng ngôn ngữ đánh dấu (Markup). Nó cung cấp một tính năng bổ sung cho HTML. Nó thường được sử dụng với HTML để thay đổi phong cách của trang web và giao diện người dùng. Nó cũng có thể được sử dụng với bất kỳ loại tài liệu XML nào bao gồm cả XML đơn giản, SVG và XUL.
CSS được sử dụng cùng với HTML và JavaScript trong hầu hết các trang web để tạo giao diện người dùng cho các ứng dụng web và giao diện người dùng cho nhiều ứng dụng di động. CSS làm được những gì? Bạn có thể thêm giao diện mới vào các tài liệu HTML cũ. Bạn hoàn toàn có thể thay đổi giao diện trang web của mình chỉ với một vài thay đổi trong mã CSS.2 Cú pháp của CSS Bộ quy tắc CSS chứa selector và khối khai báo.4: Mô hình cú pháp của CSS. Selector: Bộ chọn cho biết phần tử HTML bạn muốn tạo kiểu cách.
Nó có thể là bất kỳ thẻ nào như <h1>, <title>,. Declaration Block: Khối khai báo có thể chứa một hoặc nhiều khai báo được phân cách bởi dấu chấm phẩy (;). Đối với ví dụ trên, có hai khai báo: 8 1. font-size: 11 px; Mỗi khai báo chứa một tên thuộc tính và giá trị, được phân cách bởi dấu hai chấm.
Property: Một property là một kiểu của thuộc tính của phần tử HTML. Nó có thể là color, border,. Value: Các giá trị được gán cho thuộc tính CSS. Trong ví dụ trên, giá trị “yellow” được gán cho thuộc tính color.
Selector{Propertyl: valuel; Property2: value2; .3 Tại sao phải sử dụng CSS Đây là ba lợi ích chính của CSS: Giải quyết một vấn đề lớn Trước khi có CSS, các thẻ như phông chữ, màu sắc, kiểu nền, các sắp xếp phần tử, đường viền và kích thước phải được lặp lại trên mọi trang web. Đây là một quá trình rất dài tốn thời gian và công sức. Ví dụ: Nếu bạn đang phát triển một trang web lớn nơi phông chữ và thông tin màu được thêm vào mỗi trang, nó sẽ trở thành một quá trình dài và tốn kém. CSS đã được tạo ra để giải quyết vấn đề này.
Đó là một khuyến cáo của W3C. Tiết kiệm rất nhiều thời gian Định nghĩa kiểu CSS được lưu trong các tệp CSS bên ngoài vì vậy có thể thay đổi toàn bộ trang web bằng cách thay đổi chỉ một tệp.