Hello HTML CSS3 (part 1 – HTML)

Môn: Giao Tiếp Người Máy Seminar: Hello! HTML & CSS3 (Part – HTML)  Mục tiêu: Giới thiệu HMTL5 HTML5 form Dynamic Graphic Audio and video Tổng quan HTML5 API I Giới thiệu HTML5  Định nghĩa HTML5: chuẩn để cấu trúc diện nội dung WWW Là thành phần đánh dấu/ cú pháp mơi, thẻ công nghệ có tác dụng cung cấp tính mạnh mẽ cho công cụ tạo website hữu dụng tinh xảo  Các thành phần HTML5: + Thành phần chính: , , , , , +Thành phần bổ sung: - : cho phép nhúng video file âm trang web, không cần sử dụng đến plug-in trình duyệt Cú pháp: - : - Web form: Thành phần form HTML thực thi giúp trình làm việc với form dễ dàng -Một số thành phần khác: , : gán nhán( thích) cho hình ảnh : nhóm thành phần vào thành phần hợp lý  Khai báo DOCTYPE: kiểm tra hợp lệ tài liệu  Phần tử nội dung (content) HTML5: - Phần tử : Đại diện cho nhóm hỗ trợ, giới thiệu or định hướng Title - Phần tử : chứa thành phần định hướng cho web

- Phần tử : biểu diễn vùng chung tài liệu ứng dụng

- Phần tử : thành phần tự chứa tài liệu , trang, ứng dụng… Phần tử có ,

Nôi dung h2

-Phần tử : sử dụng cho vùng sidebar website, vùng nội dung liên quan bên phần tử

Nội dung h2

Văn

-Phần tử : Không thuộc lớp phần tử chia đoạn, có nhiều footer trang web

@Copyright LTX

 Các mô hình nội dung HTML5 (The HTML5 content model): Xác định giá trị sử dụng phần tử ví trí cụ thể - Flow Content: Đại diện cho phần tử coi nội dung trang web Sectioning Content: Xác định phạm vi header footer Heading Content: Chứa phần tử tiêu đề chuẩn, bổ sung thêm Phrasing Content: văn tài liệu bao gồm phần tử đánh dấu văn bên đoạn văn Embedded Content: Là dung nhập tài nguyên khác hình ảnh hay video Interactive Content: Là phần tử sử dùng để tương tác người dùng Metadata Content: Là phần nội dung thiết lập cách trình bày hành vi nội dung có trang web, thiết lập quan hệ tài liệu thường chứa từ khóa mô tả cho trang web III.Dynamic Graphic  Sử dụng để kéo khối hình, văn hình ảnh làm việc với phần tử nào?  Canvas hàm API vẽ chiều HTML5 + Hình vẽ sử dụng Canvas: Cập nhật thời gian thực lưu dạng png + Sử dụng để xác định bề mặt vẽ (hướng vẽ, hình dạng, màu sắc dòng kết với Javascript + Luôn làm việc với Javascript + Các bước làm việc với Canvas: - Định nghĩa thành phần canvas HTML - Tham chiếu bối cảnh vẽ cho phần tử biến javascript + Khởi tạo: Kết hợp với Javascript: