giáo trình dreamweaver 8

giáo trình dreamweaver 8 tài liệu, giáo án, bài giảng , luận văn, luận án, đồ án, bài tập lớn về tất cả các lĩnh vực kin...

Giáo trình DreamWeaver 8 Bởi: Trần Việt An Giáo trình DreamWeaver 8 Bởi: Trần Việt An Phiên bản trực tuyến: < http://vocw.vn/content/col10468/1.1/ > Thư viện Học liệu Mở Việt Nam Tài liệu này và việc biên tập nội dung có bản quyền thuộc về Trần Việt An. Tài liệu này tuân thủ theo giấy phép Creative Commons Attribution 3.0 (http://creativecommons.org/licenses/by/3.0/). Tài liệu được hiệu đính ngày: January 11, 2011 Ngày tạo PDF: January 11, 2011 Để biết thông tin về đóng góp cho các module có trong tài liệu này, xem tr. 156. Nội dung 1 Start Page của DreamWeaver 8 . . . . . . . . . . . 1 2 Cửa sổ tài liệu . . . . . . . . . . . . . . . 11 3 DreamWeaver 8 Document . . . . . . . . . . . 19 4 Status Bar , Property Inspector và Panel . . . . . . . 25 5 Layout - Quản lý các cửa sổ . . . . . . . . . . . 43 6 Site cục bộ . . . . . . . . . . . . 51 7 Site từ xa . . . . . . . . . . . . . . . . 59 8 FTP , SFTP và Web DAV (1) . . . . . . . . . . . 67 9 FTP , SFTP và Web DAV (2) . . . . . . . . . . . 75 10 Hiệu chỉnh Site . . . . . . . . . . . . 89 11 Panel Files trong DreamWeaver 8 . . . . . . . . . . 93 12 Panel Files trong DreamWeaver 8 (2) . . . . . . 101 13 SYNCHRONIZE Đồng Bộ Hóa . . . . . . . . . . 105 14 Trang trang đầu tiên với DreamWeaver 8 . . . . . . . . . . 109 15 Hyperlink - Siêu liên kết . . . . . . . . . . . . 125 16 Insert Ảnh . . . . . . . . . . . . . . 139 17 Thuộc tính của Page (Page Properties) . . . . . . . . . . . 147 Chỉ mục . . . . . . . . . . . . . . . . . 155 Tham gia đóng góp . . . . . . . . . . .156 iv Chương 1 Start Page của DreamWeaver 8 1 1.1 Nguồn cung cấp tài liệu - Mua dỉa Macromedia _AIO _ V2 ( AIO là All In One gồm nhiều Phần mềm Macromedia trong 1 đĩa ) tại các cửa hàng Vi Tính . Bạn đưa danh sách họ sẽ truy lục trên máy và lấy dỉa bán cho bạn . Trong đó có Chương Trình Dreamweaver 8 nầy. Hình 1.1 - Bạn cũng có thể download DreamWeaver 8 ở trên mạng . 1.2 Cài đặt Mở đĩa chứa Chương Trình ALL IN ONE > Folder DREANWEAVER > Dung lượng 67.20 MB , nhấp File Setup.exe. ( Hình 2 ) 1 Phiên bản trực tuyện của nội dung này có ở <http://vocw.vn/content/m33992/1.1/>. 1 2 CHƯƠNG 1. START PAGE CỦA DREAMWEAVER 8 Hình 1.2 Next > I Accept . . . > Next > Nhấp chọn Create Shortcut On Desktop > Next > Nhấp chọn Select All > Next > Install > Chạy cài đặt > Finish . Trong dia nầy khi cài đặt không cần Paste File Keygen do Tác giả đã hiệu chỉnh sẵn. Ra Desktop > Nhấp Shortcut > Chọn Designer > Ok . ( Hình 3 ). Hình 1.3 1.3 Mô tả giao diện Start Page OPEN A RECENT NEW : 3 Chứa danh sách 10 Mục được mở gần đây . Nếu mở ít hơn 10 Mục , nó chỉ hiển thị số . Nếu chưa sử dụng Dreaweaver ( D ) , nỏ chỉ xuất hiện Folder Open. CREATE NEW : Chọn 1 trong những tùy chọn sẽ tạo 1 File HTML , Cold Fusion , PHP , ASP VB Script , ASP NET C# , JavaScript , XML , XSLT ( Entire Page ) , CSS , Tạo 1 Site Dreamweaver. Chọn More để hiển thị Hộp Thoại New Document cung cấp nhiều lựa chọn . Hình 1.4 CREATE FROM SAMPLES : Phần giúp bạn chỉ học về xây dựng các Website . Chứa các Folder , từng Folder chứa nhiều Trang mẫu trình bày đẹp Nhấp bất cứ Folder nào sẽ mở Hộp thoại New Document. Nhấp Folder Css Style Sheets > Trong HT nầy bạn có thể chọn nội dung của các Folder khác. 4 CHƯƠNG 1. START PAGE CỦA DREAMWEAVER 8 Hình 1.5 EXTEND : Mở Rộng . Bạn có thể thêm chức năng vào Dreaweaver vốn chưa được đưa vào bằng cách thực hiện thông qua 1 công nghệ gọi là Extensions. Extensions là 1 phần mềm nhằm mở rộng những tính năng của Dreaweaver. Có thể nhận thêm Extensions của Macromedia Dreaweaver Exchange . Khi nhấp vào chữ :Dreamweaver Exchange.( Xem phần Phụ lục cuối quyển sách ). [...]... liên kết đến Trang Web Công cụ trợ giáo trực tuyến bằng cách sử dụng Breeze Web ( Hình7 ) 6 CHƯƠNG 1 START PAGE CỦA DREAMWEAVER 8 Hình 1.7 Nhấp lên : Learn About Documentation Resources : Hiển thị tài liệu trực tuyến ( Hình 8 ) 7 Hình 1 .8 Nhấp lên : Find Authorized Training mở Trang Web cung cấp các tài nguyên đào tạo ( Hình 9 ) 8 CHƯƠNG 1 START PAGE CỦA DREAMWEAVER 8 Hình 1.9 Nếu không thích mở giao... phụ (H12) Hình 2.12 18 CHƯƠNG 2 CỬA SỔ TÀI LIỆU Chương 3 DreamWeaver 8 Document 1 Vì đây là giai đoạn đầu bạn và tôi cùng tìm hiểu vể Giao Diện của Dreamweaver 8 nên đôi khi tháy mái làm xáo trộn màn hình không trở về Standard được Bạn vô Menu Help > Dreamweaver Help > Nhập View Standard > Cột Trái chọn Swithching from Standard To LayOut Mode ( H1) Hình 3.1 Trở về giao diện chương trình : Menu View >... 19 20 CHƯƠNG 3 DREAMWEAVER 8 DOCUMENT Hình 3.2 2 NÚT SPLIT : Có cả phần Code và Design Mã nằm phía trên Khung xem WYSIWG ( What You See Is You Get ) phía dưới Dùng tìm hiểu về Markup , tinh chỉnh các Tag xem diện mạo của kiểu thiết kế Rê thanh giữa để nới rộng và thu hẹp 2 phần nầy.(H3) 21 Hình 3.3 3 NÚT DESIGN : Nơi bạn nhập dữ liệu Khi xem trong Trình Duyệt ( Browser ) cũng giống... Là nơi bạn thao tác thực hiện thiết kế Trang Web Bạn có thể xem trên các chế độ : Design – Code – Split.(H4) 22 CHƯƠNG 3 DREAMWEAVER 8 DOCUMENT Hình 3.4 4 CÁC LOẠI NÚT PHỤ : Chứa mọi thứ , bạn nhấp lên để tìm hiểu thêm Đáng chú ý Nút Preview In Browser đang liên kết đến các trình duyệt của bạn đang sử dụng ( H5 ) Hình 3.5 5 TITTLE : Nhập Tiêu đề Trang 23 CÁC THANH CÔNG CỤ KHÁC : Khi nhấp Phải trong... Ít hữu dụng , cho phép bạn chèn các đối tượng như Table – Khung – Script vốn được thực hiện tốt hơn ở nơi khác (H7) Hình 2.7 • APPLICATION : Giúp cho bạn làm việc với các cơ sở dữ liệu bên ngoài (H8) Hình 2 .8 • FLASH ELEMENTS : Chỉ chứa 1 Đối tượng bộ xem ảnh Flash.Nếu muốn thêm các thành phần Flash như Nút Flash – Text – Video hãy quay về Common > Nút Media ( H9+10) 16 CHƯƠNG 2 CỬA SỔ TÀI LIỆU Hình... nguyên đào tạo ( Hình 9 ) 8 CHƯƠNG 1 START PAGE CỦA DREAMWEAVER 8 Hình 1.9 Nếu không thích mở giao diện START PAGE nầy nhấp lên : Don‘t Show Again ( Hình 10 ) 9 Hình 1.10 10 CHƯƠNG 1 START PAGE CỦA DREAMWEAVER 8 Chương 2 Cửa sổ tài liệu 1 1 Khi nhấp Shortcut hiện ra Bảng WorkSpace Setup > Chọn Designer > Ok Nếu thay đổi chọn lựa trên > Menu Window > WorkSpace LayOut Ra 3 Mục để bạn chọn lựa Sách nầy giả... để chọn Style Rendering có các chức năng New – Open – Save – Print – Cut – Copy – Paste bạn có thể tắt thanh Insert và Thanh Document Để mở lại : View > Toolbars > Chọn các thanh 24 CHƯƠNG 3 DREAMWEAVER 8 DOCUMENT Chương 4 Status Bar , Property Inspector và Panel 1 4.1 Status Bar (Thanh trạng thái) Undo : Ctrl+Z – REDO : CTRL+Y 1 Nhập Text vào 2 Góc đáy bên Trái là Bộ Chọn Thẻ ( Tag Selector ):... cửa sổ có sẵn ) – Ô chót : Ước tính thời gian mà trình duyệt Download trang nầy Nếu không thích 2 Ô cuối cùng nầy , bạn có thể thay đổi bằng cách chọn Edit Sizes từ Menu bật lên H2) 27 Hình 4.2 4.2 Property Inspector Căn cứ những gì được chọn trong cửa sổ tài liệu , các tùy chọn mô tả sẽ xuất hiện trong cửa sổ nầy • Bôi đen chọn AUGUST 3.2006 (H3)  28 CHƯƠNG 4 STATUS BAR , PROPERTY INSPECTOR VÀ PANEL... 11 12 CHƯƠNG 2 CỬA SỔ TÀI LIỆU Hình 2.1 2 Cột Create New giúp bạn tạo 1 Trang hoặc 1 Site mới Có nhiều lực chọn bên dưới cột 2.1 Cửa sổ tài liệu Thí dụ ta chọn HTML 1 Đây là 1 Cửa sổ tài liệu Dreamweaver đơn giản Ban có thể chỉnh sửa nó để thích hợp với những thói quen của bạn 2 Nếu mở nhiều Files cùng lúc , bạn sẽ thấy các Tables nằm dọc ở phần trên cùng cửa sổ Bạn nhấp vào 1 Table để chỉnh... kết với ảnh (H3) 14 CHƯƠNG 2 CỬA SỔ TÀI LIỆU Hình 2.3 • LAYOUT : nhấp nút xổ xuống chọn Layout Hiện ra gồm các Tables – Div – Layer – Khung ( Frame ) Các Đối tượng nầy giúp bạn mô tả cách bạn muốn trình bày Trang (H4) Hình 2.4 • FORM : Gồm các thành phần Form như Trường Text , Nút và Hộp kiểm (H5) Hình 2.5 • TEXT : Giúp tạo Style cho Text đã nằm trên Trang tốt hơn là dùng Property Inspector ( Nằm . Giáo trình DreamWeaver 8 Bởi: Trần Việt An Giáo trình DreamWeaver 8 Bởi: Trần Việt An Phiên bản trực tuyến: < http://vocw.vn/content/col104 68/ 1.1/ > Thư viện Học. dỉa bán cho bạn . Trong đó có Chương Trình Dreamweaver 8 nầy. Hình 1.1 - Bạn cũng có thể download DreamWeaver 8 ở trên mạng . 1.2 Cài đặt Mở đĩa chứa Chương Trình ALL IN ONE > Folder DREANWEAVER. liệu trực tuyến .( Hình 8 ). 7 Hình 1 .8 Nhấp lên : Find Authorized Training mở Trang Web cung cấp các tài nguyên đào tạo . ( Hình 9 ). 8 CHƯƠNG 1. START PAGE CỦA DREAMWEAVER 8 Hình 1.9 Nếu không