TRƯỜNG ĐẠI HỌC HOA SEN KHOA KHOA HỌC & CÔNG NGHỆ BỘ MÔN HỆ THỐNG THÔNG TIN LÀM VIỆC VỚI BẢNG & HÌNH ẢNH TRONG TRANG WEB Ging viên điều phối: PHẠM TH THANH TÂM Email: ptttam@khcn.hoasen.edu.vn Chương 2: THIT K WEB & CÁC CÔNG CỤ Đ HA (TINV205DV02) LÀM VIỆC VỚI BẢNG Môn học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 2 1. GIỚI THIỆU  Bng (Table) đưc dng đ đnh v cc đối tưng, chia ct, bố cc trang.  Bng đưc s dng mt cch cch hiu qu đ trnh by cc thông tin c tnh lit kê, phân loi tng dng…  Mt bng bao gm nhiều hng (row) v nhiều ct (column). Phn giao nhau gia hng v ct gi l ô (cell)  Ô l đơn v nh nht trong bng v l nơi cha ni dung (dng văn bn hay hnh nh…) Môn học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 3 1. GIỚI THIỆU (tt) Môn học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 4 V d Bng 2. CÁC THAO TÁC TRÊN BẢNG Môn học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 5 2.1. To mt bng mới hoặc Cách 1 Cách 2 2. CÁC THAO TÁC TRÊN BẢNG (tt) 2.2. Thêm hng/ct Môn học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 6 hoặc Cách 1 Cách 2 2. CÁC THAO TÁC TRÊN BẢNG (tt) 2.3. Xóa hng/ct Môn học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 7 hoặc Cách 1 Cách 2 2. CÁC THAO TÁC TRÊN BẢNG (tt) 2.4. Trn nhiều ô thành mt ô – Chn 2 hay nhiều ô muốn trn Môn học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 8 Cách 1 Cách 2 hoặc 2. CÁC THAO TÁC TRÊN BẢNG (tt) 2.5. Tách mt ô thành nhiều ô – Chn ô muốn tách thành 2 hay nhiều ô Môn học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 9 hoặc Tch theo ct Tách theo dòng 2. CÁC THAO TÁC TRÊN BẢNG (tt) 2.6. Tách mt bng thành 2 bng Môn học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 10 hoặc Cách 2 Cách 1 [...]... - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 29 5 CHÈN ẢNH LÀM ĐÁNH DẤU ĐẦU DÒNG – Chọn danh sách cần chèn ảnh làm đánh dấu đầu dòng – Vao menu Format > Bullets and Numbering… Môn học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 30 KẾT THÚC HỎI – ĐÁP Môn học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình. .. kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 12 2 CÁC THAO TÁC TRÊN BẢNG (tt) Tiêu đề của bảng Môn học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 13 2 CÁC THAO TÁC TRÊN BẢNG (tt)  Thay đổi vị trí của tiêu đề bảng – Click phải lên tiêu đề bảng > Caption Properties Môn học: Thiết kế web & Các công cụ đồ họa. .. - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 14 3 SỬ DỤNG LAYOUT TABLES Task Panes 3.1 Tạo một bảng với layout có sẵn (View > Toolbars > Tables) Môn học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 15 3 SỬ DỤNG LAYOUT TABLES (tt) 3.2 Thay đổi kích thước của ô trong bảng Môn học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với. .. Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 16 3 SỬ DỤNG LAYOUT TABLES (tt) 3.3 Vẽ một bảng với layout tùy ý Môn học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 17 3 SỬ DỤNG LAYOUT TABLES (tt) 3.4 Thay đổi kích thước của bảng Môn học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 18 3 SỬ DỤNG LAYOUT... Picture Properties  Vào menu Format > Properties (Alt + Enter) Môn học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 26 3 CHỈNH SỬA HÌNH ẢNH (tt) Đường dẫn của hình ảnh Dòng ghi chú cho ảnh Tạo liên kết cho ảnh Môn học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 27 3 CHỈNH SỬA HÌNH ẢNH (tt) Chọn kiểu... học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 21 3 ĐỊNH DẠNG BẢNG (tt) Canh lề của ô trong trang web theo chiều ngang/dọc Chiều rộng và chiều dài của ô Trộn theo dòng Trộn theo cột Đường viền của ô (0 hoặc >=1) Màu viền của ô Màu nền của ô Hình nền của ô Môn học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình ảnh trong... chứa website Môn học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 24 2 CHÈN HÌNH ẢNH TỪ FILE – Chọn vị trí nơi chèn ảnh – Vào menu Insert > Picture > From File… – Chọn file ảnh và click nút Insert Môn học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 25 3 CHỈNH SỬA HÌNH ẢNH – Chọn ảnh muốn chỉnh... trang web 22 LÀM VIỆC VỚI HÌNH ẢNH Môn học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 23 1 GIỚI THIỆU  Hình ảnh: – Là thành phần làm đẹp thêm cho trang web – Có thể cung cấp thông tin và tăng tính dễ đọc của trang web  Lưu ý: – Tất cả các tập tin hình phải được lưu trong thư mục con của thư mục chứa website Môn học: Thiết kế web. .. kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 28 4 TẠO HÌNH NỀN CHO TRANG WEB – C1: Trong chế độ Design View, click phải vào một vùng trống bất kỳ trên trang web > Page Properties > chọn tab Formatting – C2: Vào meu Format > Background… Click chọn để xác định chế độ hình nền Chọn đường dẫn chứa file ảnh Môn học: Thiết kế web & Các công cụ đồ họa. ..2 CÁC THAO TÁC TRÊN BẢNG (tt) 2.7 Xóa bảng Cách 1 Cách 2 hoặc Môn học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 11 2 CÁC THAO TÁC TRÊN BẢNG (tt) 2.8 Tiêu đề của bảng – Là một chú thích của bảng xuất hiện phía trên bảng – Cách chèn tiêu đề của . kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 3 1. GIỚI THIỆU (tt) Môn học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và. 2: THIT K WEB & CÁC CÔNG CỤ Đ HA (TINV205DV02) LÀM VIỆC VỚI BẢNG Môn học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 2 1. GIỚI. Chương 2: Làm việc với Bảng và Hình ảnh trong trang web 18 3. SỬ DỤNG LAYOUT TABLES (tt) 3.5. Vẽ mt ô với layout tùy ý Môn học: Thiết kế web & Các công cụ đồ họa - Chương 2: Làm việc với Bảng