Bài giảng - Giáo án: Bài giảng học lập trình html như thế nào là hiệu quả?

68 897 0
Bài giảng - Giáo án: Bài giảng học lập trình html như thế nào là hiệu quả?

Đang tải... (xem toàn văn)

Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống

Thông tin tài liệu

1 Giảng viên: Hoàng Văn Hiệp Bộ môn: Kỹ Thuật máy tính Viện CNTT-TT – ĐH Bách Khoa Hà Nội Email: hiephv@soict.hut.edu.vn Ngôn ngữ HTML Đại học Bách khoa Hà nội NGÔN NGỮ HTMLHTML gì?  Các thẻ trong HTML. 2 Đại học Bách khoa Hà nội HTML GÌ?  Hyper Text Markup Language – Ngôn ngữ đánh dấu siêu văn bản  Đƣợc sử dụng để tạo nên các trang web  Trình duyệt đọc file HTML để hiển thị nội dung  một file văn bản có chứa các thẻ (tag) và nội dung trang web 3 Đại học Bách khoa Hà nội HTML GÌ?  Các thẻ đƣợc sử dụng để định dạng dữ liệu, quy định cách thức hiển thị nội dung trang web  HTML không phân biệt chữ hoa hay chữ thƣờng  HTML không báo lỗi cú pháp, nếu sai cú pháp kết quả hiển thị không đúng. 4 Đại học Bách khoa Hà nội HTML GÌ?  Một file HTML phải có phần mở rộng htm hoặc html  File HTMLthể đƣợc tạo bởi bất kỳ chƣơng trình soạn thảo nào (word, notepad, …) 5 Đại học Bách khoa Hà nội CÁC THẺ TRONG HTML  Đƣợc sử dụng để đánh dấu các thành phần của HTML  Có nhiều kiểu thẻ, mỗi kiểu thẻ có tác dụng khác nhau  Có 2 loại: thẻ đóng và thẻ mở 6 Đại học Bách khoa Hà nội CÚ PHÁP THẺThẻ mở  <tên_thẻ>  Bắt đầu một lệnh HTML  Ví dụ <html>, <head>, <body>  Thẻ đóng  </tên_thẻ>  Kết thúc một lệnh HTML  Ví dụ </html>, </head>, </body> 7 Đại học Bách khoa Hà nội CÚ PHÁP THẺThẻ đóng và thẻ mở thƣờng đi liền với nhau  <tên_thẻ>…</tên_thẻ>  Tác động đến dữ liệu bên trong cặp thẻ  Một số thẻ chỉ có thẻ mở  <img>, <br>, <hr> 8 Đại học Bách khoa Hà nội THUỘC TÍNH CỦA THẺ  Mỗi thẻthể có 1 hoặc nhiều thuộc tính  Mỗi thuộc tính có tên thuộc tính và giá trị, giá trị đƣợc đặt trong dấu “”  Cú pháp  <tên_thẻ tên_TT1=“giá_trị1” tên_TT2=“giá_trị2” …> 9 Đại học Bách khoa Hà nội THUỘC TÍNH CỦA THẺ  Thuộc tính đƣợc viết trong thẻ mở  <h1 align=“center”>Hello world</h1>  Các thuộc tính có thể đổi vị trí cho nhau  <image align=“center” src=“hello.png”>  <image src=“hello.png” align=“center”> 10 Đại học Bách khoa Hà nội [...]... Đại học Bách khoa Hà nội 20 ĐOẠN VĂN, NGẮT DÒNG Paragraph Đây paragraph 1 Căn trái. Đây paragraph 2 Căn giữa. Đây paragraph 3 Căn phải. Dòng 1 Dòng 2 Đại học Bách khoa Hà nội < /html> 21 ĐOẠN VĂN, NGẮT DÒNG Đại học. .. giữa 2 thẻ  Tác dụng: làm đậm nội dung khi hiển thị trên trình duyệt  Đại học Bách khoa Hà nội 14 CÁC THẺ HTML CƠ BẢN  … < /html>  Đánh  …  Đánh  dấu một file HTML dấu phần đầu của file HTML …  Đánh dấu phần nội dung đƣợc hiển thị  Thuộc tính bgcolor xác định màu nền của trang web  Thuộc tính background xác định ảnh nền trang web Đại học Bách khoa Hà nội...TRANG WEB ĐẦU TIÊN Title of page This is my first homepage This text is bold < /html> Đại học Bách khoa Hà nội 11 HIỂN THỊ TRÊN TRÌNH DUYỆT Đại học Bách khoa Hà nội 12 HIỂN THỊ TRÊN TRÌNH DUYỆT Đại học Bách khoa Hà nội 13 GIẢI THÍCH  Thành phần This text is bold thẻ mở  thẻ đóng tƣơng ứng  Nội dung của thành... Arial Đại học Bách khoa Hà nội < /html> 25 ĐỊNH DẠNG VĂN BẢN Đại học Bách khoa Hà nội 26 CÁC KÝ TỰ ĐẶC BIỆT Không nhập trực tiếp đƣợc từ bàn phím  Trùng với các thẻ HTML, không đƣợc hiển thị trên màn hình  Sử dụng các ký hiệu đƣợc quy định để chèn vào trang web  Đại học Bách khoa Hà nội 27 Đại học Bách khoa Hà nội CÁC KÝ TỰ ĐẶC BIỆT Ký tự Tên ký hiệu Số hiệu     < < <... hoặc giá trị tƣơng đối Đại học Bách khoa Hà nội 31 CHÈN HÌNH ẢNH VÀO TRANG WEB Image Image < /html> Đại học Bách khoa Hà nội 32 TẠO... … chỉ số dưới Đại học Bách khoa Hà nội 23 ĐỊNH DẠNG VĂN BẢN  …  Chọn font chữ cho văn bản  Thuộc tính face xác định kiểu font  Thuộc tính size xác định kích thƣớc  Thuộc tính color xác định màu sắc Đại học Bách khoa Hà nội 24 ĐỊNH DẠNG VĂN BẢN Formating Chữ đậm.... Hà nội 15 ẢNH NỀN TRANG WEB Background Image This is my first homepage This text is bold < /html> Đại học Bách khoa Hà nội 16 MÀU NỀN TRANG WEB Background Image This is my first homepage This text is bold < /html> Đại học Bách khoa Hà nội 17 ĐỀ MỤC... " " „ ' ' 28 Đại học Bách khoa Hà nội CÁC KÝ TỰ ĐẶC BIỆT Ký tự ¢ £ ¥ € § © ® × ÷ Tên ký hiệu ¢ £ ¥ € § © ® × ÷ Số hiệu ¢ £ ¥ € § © ® × ÷ 29 CÁC KÝ TỰ ĐẶC BIỆT 30 CHÈN HÌNH ẢNH VÀO TRANG WEB   Thuộc tính src chỉ ra vị trí chứa ảnh, có thể trên máy có trang web hoặc trên... căn chỉnh lề Đại học Bách khoa Hà nội 18 ĐỀ MỤC Đề mục mức 1 Đề mục mức 2 Đề mục mức 3 Đề mục mức 4 Đề mục mức 5 Đề mục mức 6 Đại học Bách khoa Hà nội 19 ĐOẠN VĂN, NGẮT DÒNG  …  Đánh dấu một đoạn văn bản  Tự động thêm một dòng trống trƣớc và sau đoạn  Thuộc tính align căn lề cho đoạn văn bản, giá trị mặc định “left”  ... SÁCH Danh sách không sắp thứ tự  Danh sách sắp thứ tự  Các danh sách có thể lồng nhau  Đại học Bách khoa Hà nội 33 DANH SÁCH KHÔNG SẮP THỨ TỰ Ô tô Xe máy Tàu hỏa Đại học Bách khoa Hà nội 34 DANH SÁCH SẮP THỨ TỰ Mục 1 Mục 2 Mục 3 Đại học Bách khoa Hà nội 35 DANH SÁCH LỒNG NHAU Phương tiện đi lại Ô tô . hiephv@soict.hut.edu.vn Ngôn ngữ HTML Đại học Bách khoa Hà nội NGÔN NGỮ HTML  HTML là gì?  Các thẻ trong HTML. 2 Đại học Bách khoa Hà nội HTML LÀ GÌ?  Hyper Text Markup Language – Ngôn ngữ đánh. học Bách khoa Hà nội CÁC THẺ HTML CƠ BẢN  < ;html& gt; … < /html& gt;  Đánh dấu một file HTML  <head> … </head>  Đánh dấu phần đầu của file HTML  <body> … </body>. hoặc html  File HTML có thể đƣợc tạo bởi bất kỳ chƣơng trình soạn thảo nào (word, notepad, …) 5 Đại học Bách khoa Hà nội CÁC THẺ TRONG HTML  Đƣợc sử dụng để đánh dấu các thành phần của HTML

Ngày đăng: 17/04/2014, 20:48

Từ khóa liên quan

Tài liệu cùng người dùng

Tài liệu liên quan