Bài giảng môn: Coreldraw - Chương XI: Bảng và trình bày trang

BẢNG VÀ TRÌNH BÀY TRANG CHƯƠNG XIBẢNGKẺ BẢNG Cách kẻ bảng: Insert/Table, hoặc click nút Table.Rows: số dòng cần chèn.Columns: số cột cần chèn.Width: chiều rộng của bảng theo số điểm pixels hoặc phần trăm Border: độ dầy của đường viền bảng.Cell Padding: khỏang cách nội dung ô và biên ô.Cell Spacing: khoảng cách giữa các ô.HIỆU CHỈNH BẢNGChèn thêm dòng, cột vào bảng:Đặt dấu nháy tại vị trí cần chènModifytable Insert row/Insert columnCột mới mặc định chèn vào bên trái dấu nháyDòng mới mặc định chèn vào bên trên dấu nháyXoá dòng, cột, bảngChọn dòng, cột, bảng cần xóaEdit/Cut. (Ctrl +X) hoặc nhấn deleteNối các ô trong bảng:Chọn các ô cần nối ModifyTable Merge Cells.Tách các ô trong bảng:Chọn ô cần táchModifyTable Splits Cell Split Cell into Columns: tách ô thành nhiều ô theo cột.Split Cell into Rows: tách ô thành nhiều ô theo dòng.Number of columns, Rows: xác định số ô cần tách theo cột, dòng.THUỘC TÍNH CỦA BẢNG:Chọn table mở Properties inspector.Rows, Cols : số dòng, số cột.W, H : chiều rộng, chiều cao của bảng.Cellpad : khoảng cách văn bản đến ô trong bảng.Cellspace : khoảng càch giữa các ô trong bảng.Align : canh lề bảng, phải, trái, giữa.Border : độ dày nét đường viền bảng.Bg color : màu nền của bảng.Bg image : ảnh nền bảng.Brdr color : màu đường viền bảng.TRÌNH BÀY TRANG Layout Table và layout cellLayout table:Layout table là dạng biến thể của table với các thông số đi kèm :Border=0CellSpace =0CellPad=0Nếu trong trang có nhiều nội dung với những chủ đề khác nhau hoặc cần nhập nội dung với dạng cột báo chí thì dùng layout table để bố cục trang theo chủ đề được chuẩn bị trướcLayout Table dùng để bố cục trang, không dùng để chứa dữ liệu, viền khung của Layout Table có màu xanh lá câyKhi thiết kế dạng Layout, cần phải chuyển sang chế độ Layout mode, trong Insert Inspector, chọn tab Layout, chọn Layout mode, hoặc chọn View Table Mode  Layout ModeLayou ModeLayout TableLayout CellLayout cell:Layout cell Nằm trong Layout table, dùng để chứa dữ liệu, dữ liệu trong layout cell có thể là văn bản, hình ảnh, khi thíêt kế dạng layout cần lưu ý các layout cell phải sát nhau Một layout Table có thể chứa nhiều layout table con, mỗi Layout Table gồm có nhiều dòng, mỗi dòng chứa nhiều Layout Cell, số Layout Cell trên mỗi dòng có thể khác nhauMột số cách kết hợp Layout Table và Layout Cell:Vẽ một Layout Table có kích thước đầy trang, sau đó vẽ các Layout cell bên trong Layout Table theo đúng kích thước và yêu cầu của bố cụcHoặc vẽ nhiều Layout Table cùng cấpLayout Table trên chứa chứa Logo, Banner, nút ngang.Layout Table ở giữa chứa nội dung văn bản, hình ảnhLayout Table dưới chứa địa chỉ liên lạc, phoneHoặc kết hợp cả 2 cách trên, dùng 2 Layout table ngang cấp: Layout Table trên chứa Logo, banner, nút ngangLayout Table dưới chứa 2 Layout table con, một layout table trái và một layout table phảiLưu ý : Khi vẽ một Layout Cell bên ngoài Layout Table thì Dreamweaver tự phát sinh một Layout Table chứa Layout Cell đóChế độ Expanded Tables : cho hiển thị khoảng cách từ nội dung trong ô đến đường viền của Table, tiện cho việc hiệu chỉnh độ rộng của ôThụôc tính của Layout Table :Drag chuột kéo các handle của khung thay đổi kích thướcNếu cần kích thước chính xác thì nhập các thông số trong Properties Inspector của Layout TableWidth: Fixed: số Pixel xác định chiều rộngAutoStretch: tự động kéo dãn ngang theo nội dung Height: Xác định chiều cao, nhỏ nhất là 19 PixelBg: màu nềnCellPad: khoảng cách từ nội dung đến biên CellSpace: Khoảng cách giữa các Layout CellClear Row Height: tự động thay đổi chiều cao của các dòng cho vừa khít với nội dung, nếu không có nội dung thì chiều cao của dòng ít nhất là 19 PixelRemove All Spacers: Có hiệu lực khi chọn AutoStretch (xoá tất cả khoảng trống thừa)Make cells Width Consistent: tạo các cell trong Layout Table có chiều rộng như nhau.Remove Nesting : xoá Layout Table con trong các Layout Table cha.Thụôc tính của Layout Cell :Width: Fixed: Số Pixel xác định chiều rộngAutoStretch: tự động kéo dãn ngang theo nội dung văn bản hoặc hình ảnh chèn vào Layout CellHeight: Xác định số Pixel chiều cao, nhỏ nhất là 19 PixelBg: màu nền của Layout CellHorz: Canh lề cho nội dung trong Layout Cell theo chiều ngang (Left, Center, Right)Vert: Canh lề theo cho nội dung trong Layout Cell theo chiều dọcNo wrap: khi nội dung dài hơn kích thước của Layout Cell, nếu chọn mục này thì văn bản không xuống dòng mà Layout Cell tự dãn raLAYER:Giới thiệu:Layer là một thành phần mới trong thiết kế Web, nó có thể chứa nội dung văn bản, hình ảnh xếp chồng lên nhau, nổi trên trang và chuyển động rất linh hoạtLayer thường được sử dụng để thiết kế trang có các hiệu ứng đặc biệt như chữ rơi, ảnh bay,Điểm bất lợi của Layer là không hiển thị trên các trình duyệt cũ như IE4.0, Nestcape 4.0Cách tạo Layer trên trang:Có thể tạo Layer bằng một trong các cách sau:Cách 1:Chọn Standard ModeClick nút Draw Layer, drag chuột vẽ LayerCách 2:Chọn menu Insert Layout Objects  Chọn LayerHiệu chỉnh Layer:Chọn layer, Layer được chọn sẽ xuất hiện 8 Handle xung quanhThay đối kích thước của Layer:Chọn Layer cần hiệu chỉnh kích thước Click chuột vào một trong các Handle, Drag chuột để thay đổi kích thướcHoặc nhập thông số trực tiếp vào Properties InspectorChèn nội dung vào Layer:Nếu nội dung là văn bản thì nhập trực tiếp vào LayerNếu nội dung là hình ảnh thì drag chuột chọn hình trong thư mục Image thả vào Layer (hoặc chọn Insert Image)Xếp chồng các Layer: Khi cần hiển thị nhiều ảnh trên trang, nhưng không đủ chổ, ta có thể xếp chồng lên nhau, sau đó cho xuất hiện từng lớp một hoặc cho từng lớp Layer bay ra khỏi màn hình, điều này có thể thực hiện được khi kết hợp Layer, Timeline và BehaviorsThứ tự các Layer: Mỗi lớp Layer đều có thuộc tính Z-Index hiển thị thứ tự của các lớp Layer, lớp Layer sau sẽ che khuất lớp Layer trước Nếu nó có cùng toạ độ, có thể thay đổi trình tự các lớp layer bằng cách:Chọn Lớp Layer cần thay đổi thứ tựTrong Properties Inspector, nhập thứ tự mới trong mục Z-indexẨn hiện một Layer:Khi không muốn xem Layer nào thì ẩn Layer đó bằng một trong các cách sau:Trong Properties Inspector, tại thuộc tính Vis: chọn Hidden. Hoặc mở Layer Panel:Cấm xếp chồng các LayerTIMELINE PANEL:Timeline Panel là một bảng sắp xếp ảnh, lớp Layer theo một trình tự xuất hiện trên trục thời gian, nó giúp tạo các hình ảnh động.Mở Timeline Panel: Window Others TimelineTrục hoành là trục thời gianTrục tung là trục không gianFps: (Frame per Second) tốc độ chạy đầu đọc theo số khung hình trên giâyTEMPLATEGiới thiệu: Template là dạng trang mẫu được thiết kế trước chứa các thành phần dùng chung Template giữ quan hệ giữa các thành phần trong một mẫu trang được thiết kế, bố cục sẵn. Ta có thể căn cứ vào một mẫu template để tạo nhanh nhiều trang có cùng một bố cục thiết kế. Thao tác với template, ta cần phân biệt rõ giữa trang mẫu và trang sử dụng template.Trang mẫu template Là tập tin kiểu .dwt với phần thiết kế chuẩn cho một bố cục dùng chung, trong trang có 2 loại vùng: vùng được khoá và vùng không khoá.Trang sử dụng template: Là tập tin kiểu .htm nhưng có bố cục giống như trang mẫu template, ta chỉ được phép hiệu chỉnh, nhập nội dung mới cho các vùng không khoá. Khi có sự thay đổi trong trang mẫu template thì các vùng khoá của các trang sử dụng template cũng sẽ tự động cập nhật theo.Tạo trang template:Tạo mới một trang HTML template như một trang bình thường kẻ Layout table, Layout cell phù hợp, nhập nội dung, chèn hình, trang trí cho các vùng dùng chung Lưu trang mẫu template: File  Save as templateKhi lưu trang dưới dạng template (.dwt) mặc định tất cả các vùng của trang template đều bị khóa, do đó phải mở khóa cho các vùng không dùng chung Chọn vùng cần mở khóaInsert template objects Editable Region đặt tên cho vùng mở khóaCác cách khác để tạo Template:Chọn File/New..Chọn Page Designs/Text: Article D with Navigation.Chọn Creat template ở cuối phải hộp thoại.Tạo trang theo mẫu template:Chọn File/NewTrong hộp thoại New Document, chọn tab templateChọn mẫu template đã tạo sẳn create.Những vùng dùng chung sẽ bị khóa, khi thiết kế người dùng chỉ có thể thay đổi nội dung trong phần đã được mở khóaHiệu chỉnh templateMở template cần hiệu chỉnh:Modify/ template / Open Attached template.Xuất hiện trang mẫu template, thực hiện hiệu chỉnhĐổi tên template:Trong Asset Panel, nhóm templateChọn template cần đổi tên .Xoá một template:Trong Asset panel, chọn nhóm template.Chọn template cần xóaNhấn delete . Khi xoá một template sẽ ảnh hưởng đến tất cả các trang có sử dụng template. Nếu thực sự muốn xoá, trước tiên nên mở các trang sử dụng template rồi chọn chức năng tách khỏi templateTách trang khỏi templateModify/ Template/ Detach from template.Sử dụng Template cho trang: Sau khi tạo được các trang mẫu template, áp dụng một mẫu template:File/ New/ HTML tạo trang mới.Modify/ Template/ Apply template to pageChọn mẫu template.Nhập nội dung, hình ảnh vào những vùng không khoá.Hoặc thực hiện cách khác:Mở Asset Panel, nhóm template.Chọn trong danh sách các mẫu template.Chọn nút Apply.Cập nhật trang sử dụng template:Modify/ Template/ Update current page, cập nhật trang hiện hành.Modify/ Template/ Update page/ Entire site trong list box look in.