Bài giảng Thiết kế và triển khai website: Chương 3 - GV. Bùi Quang Trường

Chia sẻ: Kha Nguyên | Ngày: | Loại File: PDF | Số trang:87

Thêm vào BST

Báo xấu

141
lượt xem 20
download

Download Vui lòng tải xuống để xem tài liệu đầy đủ

Chương 3 Một số công cụ thiết kế website thuộc bài giảng thiết kế và triển khai website, cùng đi vào tìm hiểu chương này thông qua các nội dung sau: ngôn ngữ đánh dấu siêu văn bản HTML, PHP, Javascript, một số công cụ hỗ trợ thiết kế website.

Chủ đề:

Bình luận(0) Đăng nhập để gửi bình luận!

Lưu

Nội dung Text: Bài giảng Thiết kế và triển khai website: Chương 3 - GV. Bùi Quang Trường

Chương 3. MỘT SỐ CÔNG CỤ THIẾT KẾ WEBSITE Bùi Quang Trường Bộ môn CNTT – Khoa HTTT.KT – Trường ĐH Thương Mại
Nội dung • Ngôn ngữ đánh dấu siêu văn bản HTML • PHP, Javascript • Một số công cụ hỗ trợ thiết kế website 11/18/2013 Công cụ thiết kế Web - HTML 2
3.1. Ngôn ngữ HTML 3.1.1. Tổng quan về HTML 3.1.2. Các thẻ của HTML 3.1.3. Sử dụng Frontpage thiết kế web tĩnh 3.1.4. Định dạng website với CSS 11/18/2013 Công cụ thiết kế Web - HTML 3
3.1.1. Tổng quan về HTML • HTML (HyperText Markup Language) là ngôn ngữ đánh dấu siêu văn bản được thiết kế ra để tạo nên các trang web. Tập tin (File) HTML là một văn bản có chứa các thẻ đánh dấu (markup tags), các thẻ đánh dấu này giúp các trình duyệt Web hiểu được cách trình bày và hiển thị trang Web. File HTML có phần mở rộng (Extension) là htm hay html và có thể được tạo ra bằng bất cứ chương trình xử lý văn bản đơn giản nào. 11/18/2013 Công cụ thiết kế Web - HTML 4
3.1.1. Tổng quan về HTML • Trong File HTML các phần tử (Element) được đánh dấu bằng các thẻ HTML. Các thẻ này được bao bởi dấu < và dấu >. Thông thường các thẻ HTML được dùng theo một cặp (thẻ bắt đầu) và (thẻ kết thúc), văn bản nằm giữa cặp thẻ này là nội dung của phần tử. Các thẻ HTML không phân biệt chữ hoa và chữ thường, có nghĩa là các kiểu chữ đều được xem như nhau. 11/18/2013 Công cụ thiết kế Web - HTML 5
3.1.1. Tổng quan về HTML Cấu trúc cơ bản Một document HTML luôn bắt đầu bằng và kết thúc bằng (trong đó bạn cũng có thể viết nhỏ hoặc viết hoa và ). Nhờ có cặp TAG này mà Browser biết được đó là HTML - document dành cho trình duyệt. Những chữ đó chỉ để dành riêng cho Browser, người đọc chỉ nhận được những gì viết giữa cặp TAG và . Trong một document html, chú thích được dùng như sau: Như vậy một trang web viết bằng html sẽ có cấu trúc như sau: 3 11/18/2013 Công cụ thiết kế Web - HTML 6
3.1.1. Tổng quan về HTML Một trang web bao giờ cũng có hai phần cơ bản là tiêu đề và phần thân. Tiêu đề luôn được viết to. Bạn có thể dùng size lớn hơn và cũng có thể dùng những TAG đã được định sẵn cho tiêu đề. Tiêu đề của trang web Welcome to my Homepage! Tiêu đề của trang web Tiêu đề của trang web Tiêu đề của trang web Tiêu đề của trang web là to nhất và là nhỏ nhất. Tiêu đề luôn nằm ở trung tâm của trang, vì vậy ta phải dùng thêm một cặp TAG nữa : Tất cả những gì nằm giữa cặp TAG này đều được định hướng vào phía giữa của trang. 11/18/2013 Công cụ thiết kế Web - HTML 7
3.1.1. Tổng quan về HTML Trong một HTML Document, ngoài phần body còn có phần head, được viết bởi cặp tag . Nếu bạn sử dụng cặp tag này, bạn bắt buộc phải viết thêm một cặp tag nữa, đó là Giữa và là tên của trang web được browser trình bày phía trên cùng của menubar. Như vậy một trang web với "đầu" sẽ có cấu trúc như sau: Trang web dau tien cua toi Phần bạn cần trình bày. Ví dụ một bức ảnh hay lời văn. Trong "head" ta còn có thể đưa rất nhiều thông tin vào cho browser, search engine... Next 11/18/2013 Công cụ thiết kế Web - HTML 8
3.1.2. Các thẻ HTML I. C¸c thÎ ®Þnh cÊu tróc tµi liÖu 1.1 HTML 1.2 HEAD 1.3 TITLE 1.4 BODY 11/18/2013 Công cụ thiết kế Web - HTML 9
1.1 HTML • • ... Toµn bé néi cña tµi liÖu ®îc ®Æt ë ®©y • 11/18/2013 Công cụ thiết kế Web - HTML 10
1.2 HEAD • • ... PhÇn më ®Çu (HEADER) cña tµi liÖu ®îc ®Æt ë ®©y • 11/18/2013 Công cụ thiết kế Web - HTML 11
1.3 TITLE Tiªu ®Ò cña tµi liÖu 11/18/2013 Công cụ thiết kế Web - HTML 12
1.4 BODY • • .... phÇn néi dung cña tµi liÖu ®îc ®Æt ë ®©y • 11/18/2013 Công cụ thiết kế Web - HTML 13
1.4 BODY (TT) 11/18/2013 Công cụ thiết kế Web - HTML 14
3.1.2. Các thẻ HTML (TT) II. C¸c thÎ ®Þnh d¹ng khèi 2.1. ThÎ tr×nh bµy mét ®o¹n P 2.2. C¸c thÎ ®Þnh d¹ng tiªu ®Ò H1/H2/H3/H4/H5/H6 2.3 ThÎ ng¾t xuèng dßng BR 2.4 ThÎ ®Þnh d¹ng v¨n b¶n(v¨n b¶n ®îc ®Þnh d¹ng tríc trong tµi liÖu HTML vµ khi tr×nh duyÖt hiÓn thÞ th× sÏ tu©n theo ®Þnh d¹ng nµy) PRE 11/18/2013 Công cụ thiết kế Web - HTML 15
3.1.2. Các thẻ HTML (TT) III. C¸c thÎ ®Þnh d¹ng danh s¸ch Có ph¸p: Môc thø nhÊt Môc thø hai Cã 4 kiÓu danh s¸ch:  Danh s¸ch kh«ng s¾p xÕp ( hay kh«ng ®¸nh sè)  Danh s¸ch cã s¾p xÕp (hay cã ®¸nh sè) , mçi môc trong da nh s¸ch ®îc s¾p xÕp thø tù.  Danh s¸ch thùc ®¬n  Danh s¸ch ph©n cÊp 11/18/2013 Công cụ thiết kế Web - HTML 16
3.1.2. Các thẻ HTML (TT) IV. C¸c thÎ ®Þnh d¹ng ký tù 4.1. C¸c thÎ ®Þnh d¹ng in ký tù 4.2. C¨n lÒ v¨n b¶n trong trang Web 4.3. C¸c ký tù ®Æc biÖt 4.4. Sö dông mµu s¾c trong thiÕt kÕ c¸c trang Web 4.5. Chän kiÓu ch÷ cho v¨n b¶n 4.6. Kh¸i niÖm v¨n b¶n siªu liªn kÕt 11/18/2013 Công cụ thiết kế Web - HTML 17
4.1. C¸c thÎ ®Þnh d¹ng in ký tù 11/18/2013 Công cụ thiết kế Web - HTML 18
4.2. C¨n lÒ v¨n b¶n trong trang Web 11/18/2013 Công cụ thiết kế Web - HTML 19
4.3. C¸c ký tù ®Æc biÖt 11/18/2013 Công cụ thiết kế Web - HTML 20