Tìm hiểu về một số Layout phổ biến
Layout nổi (float) & Layout tuyệt đối (absolute)
Ngăn tràn bố cục
Một số vấn đề khi căn chỉnh cột Layout
Tìm hiểu về một số Layout phổ biến
Layout nổi (float) & Layout tuyệt đối (absolute)
Ngăn tràn bố cục
Một số vấn đề khi căn chỉnh cột Layout
BÀI 3 Bố cục trang web & bảng (TABLE) trên trang web - Giáo trình FPTMasterCode.vn
Bố cục website với CSS:
Mô hình CSS Box
Làm việc với div và AP div
Xếp chồng và xếp gối các thành phần
Tạo style cho nội dung hộp
Điều chỉnh vị trí
Tổ chức và phác thảo website
Cách làm việc với bảng (table) trên trang web:
Khởi tạo bảng với HTML
Định dạng style cho bảng với CSS/ HTML
Tìm hiểu về box (hộp), cấu trúc box trên một trang
của website:
Tầm quan trọng
Kích thước
Vị trí
Thuộc tính của box:
Thuộc tính về nội dung
Thuộc tính về vị trí
Thuộc tính về hiển thị
Bài 2 Cơ chế làm việc của CSS - Giáo trình FPTMasterCode.vn
Cách áp dụng CSS cho trang web
Cấu trúc & Quy tắc khai báo CSS
Pseudo-Class (lớp giả)
Tính kế thừa trong CSS
Khai báo giá trị màu sắc và số trong CSS
Cách áp dụng CSS cho trang web
Cấu trúc & Quy tắc khai báo CSS
Pseudo-Class (lớp giả)
Tính kế thừa trong CSS
Khai báo giá trị màu sắc và số trong CSS
BÀI 3 Bố cục trang web & bảng (TABLE) trên trang web - Giáo trình FPTMasterCode.vn
Bố cục website với CSS:
Mô hình CSS Box
Làm việc với div và AP div
Xếp chồng và xếp gối các thành phần
Tạo style cho nội dung hộp
Điều chỉnh vị trí
Tổ chức và phác thảo website
Cách làm việc với bảng (table) trên trang web:
Khởi tạo bảng với HTML
Định dạng style cho bảng với CSS/ HTML
Tìm hiểu về box (hộp), cấu trúc box trên một trang
của website:
Tầm quan trọng
Kích thước
Vị trí
Thuộc tính của box:
Thuộc tính về nội dung
Thuộc tính về vị trí
Thuộc tính về hiển thị
Bài 2 Cơ chế làm việc của CSS - Giáo trình FPTMasterCode.vn
Cách áp dụng CSS cho trang web
Cấu trúc & Quy tắc khai báo CSS
Pseudo-Class (lớp giả)
Tính kế thừa trong CSS
Khai báo giá trị màu sắc và số trong CSS
Cách áp dụng CSS cho trang web
Cấu trúc & Quy tắc khai báo CSS
Pseudo-Class (lớp giả)
Tính kế thừa trong CSS
Khai báo giá trị màu sắc và số trong CSS
Làm việc với dự án website
Cấu trúc thư mục khi tiến hành dự án website
Tạo kiến trúc website
@import css
Background & màu nền
Text & màu văn bản
Menu
Khung Sidebar
Form
Đánh dấu trang
Vùng nội dung
Làm việc với dự án website
Cấu trúc thư mục khi tiến hành dự án website
Tạo kiến trúc website
@import css
Background & màu nền
Text & màu văn bản
Menu
Khung Sidebar
Form
Đánh dấu trang
Vùng nội dung
Bài 1 XHTML: Cấu trúc nội dung web - Giáo trình FPTMasterCode.vn
Nhắc lại về HTML
Định nghĩa XHTML, CSS
Cách thiết kế layout trang web
Làm quen với cấu trúc một trang web
Làm quen với những plugin kiểm tra mã XHTML và
CSS trên những trình duyệt khác nhau
BÀI 1 Bước đầu làm quen với ADOBE DREAMWEAVER CS4 và những thao tác cơ bản tr...MasterCode.vn
Những khái niệm về website:
Thành phần của trang web
Tên miền, địa chỉ IP
Client – server
Công việc thiết kế website
Những kiến thức cơ bản về HTML & XHTML
Làm quen với Adobe Dreamweaver CS4
Khởi tạo một trang web và làm việc với những thành
phần trên trang web: văn bản, hình ảnh
Những khái niệm về website:
Thành phần của trang web
Tên miền, địa chỉ IP
Client – server
Công việc thiết kế website
Những kiến thức cơ bản về HTML & XHTML
Làm quen với Adobe Dreamweaver CS4
Khởi tạo một trang web và làm việc với những thành
phần trên trang web: văn bản, hình ảnh
BÀI 6 Làm việc với thành phần FORM, SPRY trong DREAMWEAVER CS4 - Giáo trình FPTMasterCode.vn
Làm việc với web form:
Giao diện và chức năng của form
Phương pháp submit thông tin của form lên server
Xác nhận các thông tin đầu vào của form
Khởi tạo và sửa đổi form trên Dreamweaver CS4
Lưu ý khi làm việc với form
Hiểu về các khái niệm liên quan tới web:
Web động phía client
XML, AJAX, RIA
Spry và cách làm việc với spry trong Dreamweaver
CS4
Làm việc với web form:
Giao diện và chức năng của form
Phương pháp submit thông tin của form lên server
Xác nhận các thông tin đầu vào của form
Khởi tạo và sửa đổi form trên Dreamweaver CS4
Lưu ý khi làm việc với form
Hiểu về các khái niệm liên quan tới web:
Web động phía client
XML, AJAX, RIA
Spry và cách làm việc với spry trong Dreamweaver
CS4
Giáo trình thiết kế web - Thiết kế web với DreamweaverKhanhPham
Giáo trình thiết kế web - Thiết kế web với Dreamweaver
Để tìm hiểu kỹ hơn các bạn hãy truy cập:
Website: www.zend.vn
Facebook: https://www.facebook.com/zendvngroup
Youtube: www.youtube.com/user/luutruonghaila
BÀI 4 Tinh chỉnh môi trường làm việc và làm việc với cách thành phần trên web...MasterCode.vn
Điều chỉnh môi trường làm việc trên Dreamweaver
CS4
Làm việc với những thành phần đa phương tiện
(multimedia) trên webpage:
Chèn file flash, video, âm thanh
Sử dụng panel Assets
Làm việc với plug-in
BÀI 5 Tối ưu hóa thiết kế web và cách làm việc cơ bản trong chế độ hiển thị C...MasterCode.vn
Sử dụng thư viện và các mẫu có sẵn:
Thiết kế dựa trên module
Các thành phần module trong Dreamweaver:
• Snippets
• Thành phần thư viện
• Mẫu (template)
Soạn thảo HTML trong môi trường Code
Sử dụng thư viện và các mẫu có sẵn:
Thiết kế dựa trên module
Các thành phần module trong Dreamweaver:
• Snippets
• Thành phần thư viện
• Mẫu (template)
Soạn thảo HTML trong môi trường Code
BÀI 4 Nâng cao khả năng thiết kế web mobile với thành phần jquery mobile - Gi...MasterCode.vn
Khởi tạo trang mới với Jquery mobile
Chèn các thành phần:
Layout grid
Collapsible block
Sử dụng các thành phần form: input với Jquery
mobile:
Jump menu
Input form
Các thành phần đặc biệt khác
Khởi tạo trang mới với Jquery mobile
Chèn các thành phần:
Layout grid
Collapsible block
Sử dụng các thành phần form: input với Jquery
mobile:
Jump menu
Input form
Các thành phần đặc biệt khác
Làm việc với dự án website
Cấu trúc thư mục khi tiến hành dự án website
Tạo kiến trúc website
@import css
Background & màu nền
Text & màu văn bản
Menu
Khung Sidebar
Form
Đánh dấu trang
Vùng nội dung
Làm việc với dự án website
Cấu trúc thư mục khi tiến hành dự án website
Tạo kiến trúc website
@import css
Background & màu nền
Text & màu văn bản
Menu
Khung Sidebar
Form
Đánh dấu trang
Vùng nội dung
Bài 1 XHTML: Cấu trúc nội dung web - Giáo trình FPTMasterCode.vn
Nhắc lại về HTML
Định nghĩa XHTML, CSS
Cách thiết kế layout trang web
Làm quen với cấu trúc một trang web
Làm quen với những plugin kiểm tra mã XHTML và
CSS trên những trình duyệt khác nhau
BÀI 1 Bước đầu làm quen với ADOBE DREAMWEAVER CS4 và những thao tác cơ bản tr...MasterCode.vn
Những khái niệm về website:
Thành phần của trang web
Tên miền, địa chỉ IP
Client – server
Công việc thiết kế website
Những kiến thức cơ bản về HTML & XHTML
Làm quen với Adobe Dreamweaver CS4
Khởi tạo một trang web và làm việc với những thành
phần trên trang web: văn bản, hình ảnh
Những khái niệm về website:
Thành phần của trang web
Tên miền, địa chỉ IP
Client – server
Công việc thiết kế website
Những kiến thức cơ bản về HTML & XHTML
Làm quen với Adobe Dreamweaver CS4
Khởi tạo một trang web và làm việc với những thành
phần trên trang web: văn bản, hình ảnh
BÀI 6 Làm việc với thành phần FORM, SPRY trong DREAMWEAVER CS4 - Giáo trình FPTMasterCode.vn
Làm việc với web form:
Giao diện và chức năng của form
Phương pháp submit thông tin của form lên server
Xác nhận các thông tin đầu vào của form
Khởi tạo và sửa đổi form trên Dreamweaver CS4
Lưu ý khi làm việc với form
Hiểu về các khái niệm liên quan tới web:
Web động phía client
XML, AJAX, RIA
Spry và cách làm việc với spry trong Dreamweaver
CS4
Làm việc với web form:
Giao diện và chức năng của form
Phương pháp submit thông tin của form lên server
Xác nhận các thông tin đầu vào của form
Khởi tạo và sửa đổi form trên Dreamweaver CS4
Lưu ý khi làm việc với form
Hiểu về các khái niệm liên quan tới web:
Web động phía client
XML, AJAX, RIA
Spry và cách làm việc với spry trong Dreamweaver
CS4
Giáo trình thiết kế web - Thiết kế web với DreamweaverKhanhPham
Giáo trình thiết kế web - Thiết kế web với Dreamweaver
Để tìm hiểu kỹ hơn các bạn hãy truy cập:
Website: www.zend.vn
Facebook: https://www.facebook.com/zendvngroup
Youtube: www.youtube.com/user/luutruonghaila
BÀI 4 Tinh chỉnh môi trường làm việc và làm việc với cách thành phần trên web...MasterCode.vn
Điều chỉnh môi trường làm việc trên Dreamweaver
CS4
Làm việc với những thành phần đa phương tiện
(multimedia) trên webpage:
Chèn file flash, video, âm thanh
Sử dụng panel Assets
Làm việc với plug-in
BÀI 5 Tối ưu hóa thiết kế web và cách làm việc cơ bản trong chế độ hiển thị C...MasterCode.vn
Sử dụng thư viện và các mẫu có sẵn:
Thiết kế dựa trên module
Các thành phần module trong Dreamweaver:
• Snippets
• Thành phần thư viện
• Mẫu (template)
Soạn thảo HTML trong môi trường Code
Sử dụng thư viện và các mẫu có sẵn:
Thiết kế dựa trên module
Các thành phần module trong Dreamweaver:
• Snippets
• Thành phần thư viện
• Mẫu (template)
Soạn thảo HTML trong môi trường Code
BÀI 4 Nâng cao khả năng thiết kế web mobile với thành phần jquery mobile - Gi...MasterCode.vn
Khởi tạo trang mới với Jquery mobile
Chèn các thành phần:
Layout grid
Collapsible block
Sử dụng các thành phần form: input với Jquery
mobile:
Jump menu
Input form
Các thành phần đặc biệt khác
Khởi tạo trang mới với Jquery mobile
Chèn các thành phần:
Layout grid
Collapsible block
Sử dụng các thành phần form: input với Jquery
mobile:
Jump menu
Input form
Các thành phần đặc biệt khác
Bài 6: Tạo hiệu ứng và validate Form - Giáo trình FPTMasterCode.vn
Viết mã tạo các hiệu ứng
Hiệu ứng Image Rollover
Hiệu ứng SlideShow
Thao tác với các điều khiển
SelectBox
CheckBox
RadioButton
Form
Kiểm tra tính hợp lệ cho Form
Mục tiêu bài học
Viết mã tạo các hiệu ứng
Hiệu ứng Image Rollover
Hiệu ứng SlideShow
Thao tác với các điều khiển
SelectBox
CheckBox
RadioButton
Form
Kiểm tra tính hợp lệ cho Form
BÀI 4 Làm việc với các thành phần VIDEO, AUDIO, CANVAS của HTML5MasterCode.vn
Chèn các thành phần video, audio vào trang
Điều khiển video với Javascript
Làm quen với thành phần canvas
Sử dụng thành phần cavas để thực hiện:
Vẽ hình và đường
Áp dụng màu và cọ fradient
Thực hiện tạo hình động
Chèn các thành phần video, audio vào trang
Điều khiển video với Javascript
Làm quen với thành phần canvas
Sử dụng thành phần cavas để thực hiện:
Vẽ hình và đường
Áp dụng màu và cọ fradient
Thực hiện tạo hình động
BÀI 3 Thiết kế web cho di động với dreamweaver CS5 & Jquery - Giáo trình FPTMasterCode.vn
Nhận diện thiết bị và tính tương thích với các thiết bị
di động
Nâng cao khả năng tương tác của web di động với
Javascript và AJAX
Thiết kế trang web cho di động với Dreamweaver
CS5:
Khởi tạo và tùy biến nội dung
Chèn thêm trang web với Jquery mobile
Định dạng trang web với CSS
Nhận diện thiết bị và tính tương thích với các thiết bị
di động
Nâng cao khả năng tương tác của web di động với
Javascript và AJAX
Thiết kế trang web cho di động với Dreamweaver
CS5:
Khởi tạo và tùy biến nội dung
Chèn thêm trang web với Jquery mobile
Định dạng trang web với CSS
Bài 13: Nâng cấp từ Windows Server 2003 lên Windows Server 2008 - Giáo trình FPTMasterCode.vn
Tại sao phải nâng cấp lên Windows Server 2008?
Yêu cầu cấu hình phần cứng
Chuẩn bị trước khi nâng cấp
Các phiên bản nâng cấp
Nâng cấp lên Windows Server 2008 AD DS
BÀI 2 Tìm hiểu ngôn ngữ đánh dấu trong việc phát triển web mobile - Giáo trìn...MasterCode.vn
Làm quen với ngôn ngữ đánh dấu cho web di động:
XHTML, XHTML -MP
WML
CSS cho web di động
Nhận diện thiết bị và tính tương thích với các thiết bị
di động
Nâng cao khả năng tương tác của web di động với
Javascript và AJAX
Bài 3 Tạo style cho font và văn bản - Giáo trình FPTMasterCode.vn
Giới thiệu về font
Một số thuộc tính quan trọng của Font
Một số thuộc tính quan trọng của Text
Kích thước của font, text trong HTML
Cách viết CSS rút gọn (shorthand)
Giới thiệu về font
Một số thuộc tính quan trọng của Font
Một số thuộc tính quan trọng của Text
Kích thước của font, text trong HTML
Cách viết CSS rút gọn (shorthand)
Hiểu rõ cách thức thiết lập web server trên máy tính cá
nhân để chạy Joomla bằng phần mềm Wampserver;
• Hướng dẫn cài đặt website Joomla trên web server được
thiết lập trên máy tính cá nhân;
• Hướng dẫn khởi tạo và cấu trúc nội dung website
Joomla;
• Hướng dẫn tạo hệ thống menu và điều hướng website
Joomla
Tổng quan về CSS3
Làm việc với các thuộc tính mới trong CSS3:
Border-radius
Border-image
Gradient
Transform, transition, animation
Làm việc với font web
Chèn nhiều hình nền với CSS3
Tổng quan về CSS3
Làm việc với các thuộc tính mới trong CSS3:
Border-radius
Border-image
Gradient
Transform, transition, animation
Làm việc với font web
Chèn nhiều hình nền với CSS3
Bài 7: Thư viện jQuery và thư viện jQuery UI - Giáo trình FPTMasterCode.vn
Thự viện và cách tạo thư viện
Thư viện JavaScript
Sử dụng thư viện jQuery
Sử dụng jQuery để tạo hiệu ứng
Hiệu ứng ẩn hiện
Hiệu ứng mờ
Hiệu ứng chuyển động
Sử dụng thư viện jQuery UI
Tạo tính năng kéo thả (drag and drop)
Tạo menu chồng nhau
Thự viện và cách tạo thư viện
Thư viện JavaScript
Sử dụng thư viện jQuery
Sử dụng jQuery để tạo hiệu ứng
Hiệu ứng ẩn hiện
Hiệu ứng mờ
Hiệu ứng chuyển động
Sử dụng thư viện jQuery UI
Tạo tính năng kéo thả (drag and drop)
Tạo menu chồng nhau
BÀI 5 Làm việc với FONT, TYPEFACE và tỷ lệ nhịp điệu trong TYPOGRAPHY - Giáo ...MasterCode.vn
Tổng quan về việc sử dụng font trên web:
Lựa chọn font
Phân loại font family trong CSS
Định rõ kiểu chữ với CSS
Web font an toàn ( web safe font)
Liên kết font web
Dịch vụ liên kết font web văn phòng
Nhúng font web với javascript
Những giải pháp để sử dụng font trên web
Tổng quan về việc sử dụng font trên web:
Lựa chọn font
Phân loại font family trong CSS
Định rõ kiểu chữ với CSS
Web font an toàn ( web safe font)
Liên kết font web
Dịch vụ liên kết font web văn phòng
Nhúng font web với javascript
Những giải pháp để sử dụng font trên web
Bài 7: Lập trình với CSDL – Sử dụng DESIGNER & Triển khai ứng dụng - Lập trìn...MasterCode.vn
Sử dụng Wizard để tạo nguồn dữ liệu
Buộc dữ liệu với điều khiển bằng Designer
Buộc dữ liệu với điều khiển DataGridView
Buộc dữ liệu với TextBox
Buộc dữ liệu với ComboBox
Truy vấn dữ liệu bằng Designer
Tùy chỉnh Toolbar
Tạo form Master/Detail
Triển khai ứng dụng
Sử dụng Wizard để tạo nguồn dữ liệu
Buộc dữ liệu với điều khiển bằng Designer
Buộc dữ liệu với điều khiển DataGridView
Buộc dữ liệu với TextBox
Buộc dữ liệu với ComboBox
Truy vấn dữ liệu bằng Designer
Tùy chỉnh Toolbar
Tạo form Master/Detail
Triển khai ứng dụng
Pd fbuoi2 onpage – tối ưu hóa trang web-mastercode.vnMasterCode.vn
Meta Tag là thẻ dùng để cung cấp các thông tin về website một cách tóm gọn đối với các trình duyệt lẫn người dùng hay bot từ các search engine. Mọi người hay nghe Meta Keyword, Meta Description, Meta Page title,..
Khóa học lập trình jQuery Master của ZendVN là một khóa học được nâng cấp từ khóa học thiết kế Web. Khóa học jQuery master này đem đến cho các bạn toàn bộ kiến thức nền tảng của lập trình website như HTML, CSS, javascript, jQuery framework, Bootstrap framework, NodeJS… ZendVN đảm bảo khóa học JQuery sẽ đem lại cho các bạn kiến thức rộng nhất và toàn diện nhất của lĩnh vực thiết kết web hiện đại.
Dù bạn là ai, dù mục đích học tiếng Anh của bạn đơn thuần chỉ là có tấm bằng trong tay để xin việc hay cao siêu hơn là có thể nói thông viết thạo thì việc nằm lòng các ngữ pháp tiếng Anh ẩn chứa sức mạnh ghê gớm dưới đây cũng là bước cơ bản giúp bạn master tiếng Anh
Scalability and optimization are constant
concerns for the developer and operations
manager. The Performance Zone focuses on
all things performance, covering everything
from database optimization to garbage
collection, tool and technique comparisons,
and tweaks to keep your code as effcient
as possible.
Google công bố thông tin lịch xu hướng ngành 2017 mastercode.vnMasterCode.vn
Các doanh nghiệp cần luôn có mặt trên online để khách hàng dễ dàng thấy họ mỗi khi tìm kiếm. "Mùa vụ" hay giai đoạn mà lượng
tìm kiếm về sản phẩm dịch vụ của doanh nghiệp trên Google bỗng gia tăng chính là thời điểm tuyệt vời để tận dụng.Các doanh nghiệp
có thể tối đa hoá doanh thu trong thời kì cao điểm này bằng cách lên chiến lược quảng cáo "luôn online" gắn liền với mục tiêu mùa.
Lập trình sáng tạo creative computing textbook mastercode.vnMasterCode.vn
Lập trình sáng tạo bao gồm việc sáng tạo. Khoa học máy tính và các ngành liên quan tới tính toán đã từ lâu đƣợc giới thiệu tới những ngƣời trẻ tuổi một cách rời rạc – quá nhấn mạnh kĩ thuật so với khả năng sáng tạo. Lập trình sáng tạo giúp cho sự phát triển của cá nhân đối với tính toán trở nên tốt hơn, bằng cách hỗ trợ vẽ vời dựa trên sáng tạo, tƣởng tƣợng, và sở thích.
Pd fbuoi1 giới thiệu seo tools cơ bản-seo manager + seo guy-mastercode.vnMasterCode.vn
Google Webmaster Tools • Google Analytics phân tích traffic • SEO Power Suite , web auditor đ onpage • Ahrefs, phân tích t khóa và Link • OpenSiteExplorer phân tích link profile • Firexfox Extensions: SEO Doctor cho onpage, NoDofollow • SEOMoz Toolbar đ check PA và DA •Free Monitor for Google đ check RANK •SEOMOZ pro check onpage
Pdf buoi1 2-on-page-tran-ngoc-chinh-mastercode.vnMasterCode.vn
Cơ chế hoạt động Google Tên miền Cấu trúc website Meta Tag (Title, Description, H1-H6, ALT...) URL thân thiện, Sitemap, robots.txt Keyword Density Tốc độ tải trang
Pdfbài 7 máy tính xác tay và máy in bảo trì sự cố máy tính-mastercode.vnMasterCode.vn
Những chú ý đặc biệt khi hỗ trợ người dùng máy tính xách tay Cài đặt, cấu hình, tối ưu, sửa chữa các thiết bị ngoại vi hay dùng với máy tính xách tay Nâng cấp, thay thế các thiết bị máy tính xách tay Nguyên lý hoạt động của máy in Cài đặt máy in
Pdfbài 6 bảo trì máy tính bảo trì sự cố máy tính-mastercode.vnMasterCode.vn
Tìm hiểu các quy trình xử lý đảm bảo an toàn Tìm hiểu phương pháp bảo trì phòng ngừa cho máy tính cá nhân Tìm hiểu cách phát hiện và xử lý sự cố máy tính
Pdfbài 5 bảo trì và tối ưu windows bảo trì sự cố máy tính-mastercode.vnMasterCode.vn
Đưa ra kế hoạch bảo trì phòng ngừa Rà soát các thiết lập Windows trọng yếu Làm sạch ổ cứng Chống phân mảnh ổ đĩa Kiểm tra lỗi ổ cứng Rà soát các chương trình khởi động và dịch vụ Tiến hành các thủ tục sao lưu Lập kế hoạch khắc phục thảm họa Sao lưu dữ liệu người dùng / toàn bộ ổ cứng Tối ưu Windows Các công cụ tối ưu: Task Manager, MSConfig, Services Console, Computer Management Cải thiện hiệu năng Windows Đưa ra kế hoạch bảo trì phòng ngừa Rà soát các thiết lập Windows trọng yếu Làm sạch ổ cứng Chống phân mảnh ổ đĩa Kiểm tra lỗi ổ cứng Rà soát các chương trình khởi động và dịch vụ Tiến hành các thủ tục sao lưu Lập kế hoạch khắc phục thảm họa Sao lưu dữ liệu người dùng / toàn bộ ổ cứng Tối ưu Windows Các công cụ tối ưu: Task Manager, MSConfig, Services Console, Computer Management Cải thiện hiệu năng Windows
Pdfbài 4 ổ cứng hard drive bảo trì sự cố máy tính-mastercode.vnMasterCode.vn
Biết được các công nghệ chế tạo ổ cứng Hiểu được cấu tạo ổ cứng Phân biệt rõ các chuẩn giao tiếp giữa hệ thống với ổ cứng Thông hiểu cách tổ chức lưu trữ dữ liệu trong ổ cứng Giải quyết các vấn đề liên quan đến ổ cứng Biết được các công nghệ chế tạo ổ cứng Hiểu được cấu tạo ổ cứng Phân biệt rõ các chuẩn giao tiếp giữa hệ thống với ổ cứng Thông hiểu cách tổ chức lưu trữ dữ liệu trong ổ cứng Giải quyết các vấn đề liên quan đến ổ cứng
Pdfbài 3 cpu và ram bảo trì sự cố máy tính-mastercode.vnMasterCode.vn
Nhận biết được đặc điểm và thông số kỹ thuật của các CPU dùng cho máy tính cá nhân Thông hiểu cách lựa chọn CPU cho hệ thống Thông hiểu cách lắp mới và thay thế CPU Thông hiểu các phương pháp tản nhiệt cho CPU Thông hiểu các loại RAM khác nhau và nguyên lý hoạt động của chúng. Thông hiểu các vấn đề cần thiết khi nâng cấp RAM
Pdfbài 1 giới thiệu chung về phần cứng bảo trì sự cố máy tính-mastercode.vnMasterCode.vn
Nhắc lại các khái niệm cơ bản về phần cứng và phần mềm. Giới thiệu về các thành phần của máy tính. Nắm được vị trí sắp xếp của các thành phần bên trong case, các loại case khác nhau. Nắm được các thông số về nguồn điện được sử dụng để vận hành hệ thống máy tính. Ước lượng công suất của hệ thống và chọn bộ cấp nguồn và thiết bị lưu điện cho phù hợp. Nhận biết và xử lý một số vấn đề thường gặp liên quan đến nguồn điện
2. NHẮC LẠI BÀI TRƯỚC
Tìm hiểu về box (hộp), cấu trúc box trên một trang
của trang website:
Tầm quan trọng
Kích thước
Vị trí
Thuộc tính của box:
Thuộc tính về nội dung
Thuộc tính về vị trí
Thuộc tính về hiển thị
Tìm hiểu về box (hộp), cấu trúc box trên một trang
của trang website:
Tầm quan trọng
Kích thước
Vị trí
Thuộc tính của box:
Thuộc tính về nội dung
Thuộc tính về vị trí
Thuộc tính về hiển thị
Bài 5 - Bố cục trang cơ bản 2
3. MỤC TIÊU BÀI HỌC
Tìm hiểu về một số Layout phổ biến
Layout nổi (float) & Layout tuyệt đối (absolute)
Ngăn tràn bố cục
Một số vấn đề khi căn chỉnh cột Layout
Tìm hiểu về một số Layout phổ biến
Layout nổi (float) & Layout tuyệt đối (absolute)
Ngăn tràn bố cục
Một số vấn đề khi căn chỉnh cột Layout
Bài 5 - Bố cục trang cơ bản 3
5. BỐ CỤC TRANG (LAYOUT)
Layout thường được chia thành nhiều cột
Rõ ràng trong việc thiết kế CSS
Áp dụng được tính kế thừa
Đảm bảo nội dung được lấp đầy
Không bị xô lệch giữa các box trong layout
Bài 5 - Bố cục trang cơ bản
Layout thường được chia thành nhiều cột
Rõ ràng trong việc thiết kế CSS
Áp dụng được tính kế thừa
Đảm bảo nội dung được lấp đầy
Không bị xô lệch giữa các box trong layout
5
6. MỘT SỐ DẠNG BỐ CỤC
layout
2 cột
3 cột…
Bài 5 - Bố cục trang cơ bản
layout 3 cột
4 cột
…
6
7. BỐ CỤC 2 CỘT
http://blog.jingproject.com/
Bài 5 - Bố cục trang cơ bản 7
8. BỐ CỤC 3 CỘT
http://www.amazon.com
Bài 5 - Bố cục trang cơ bản 8
9. BỐ CỤC 4 CỘT
http://www.alistapart.com/
Bài 5 - Bố cục trang cơ bản 9
10. BỐ CỤC 2 CỘT CHIỀU RỘNG CỐ ĐỊNH
Demo ví dụ trong các file:
2_col.html -> cấu trúc và nội dung trang
2_col.css -> đặt css để tạo layout
text_n_colors.css -> định style và màu cho text
Demo ví dụ trong các file:
2_col.html -> cấu trúc và nội dung trang
2_col.css -> đặt css để tạo layout
text_n_colors.css -> định style và màu cho text
Bài 5 - Bố cục trang cơ bản 10
11. BỐ CỤC 3 CỘT THƯỜNG
Không khai báo giá trị width
Sử dụng ràng buộc:
max-width:…;
min-width:…;
<body>
<div id="main_wrapper"><!--<địnhnghĩa div chứa toàn bộ nội dung web>-->
<div id="header"><!--<địnhnghĩa phần header của trang web>-->
<div id="header_inner">…</div>
</div>
<div id="nav"><!--<địnhnghĩa vùng chứa navigator (điều hướng) của trang web>--
>
<div id="nav_inner">…</div>
</div>
<div id="content">
<div id=“content_inner“>…</div>
</div>
<div id="footer"><!--<địnhnghĩa vùng chân (footer) của trang web>-->
<div id="footer_inner“>…</div>
</div>
</div>
</body>
Bài 5 - Bố cục trang cơ bản
Không khai báo giá trị width
Sử dụng ràng buộc:
max-width:…;
min-width:…;
11
<body>
<div id="main_wrapper"><!--<địnhnghĩa div chứa toàn bộ nội dung web>-->
<div id="header"><!--<địnhnghĩa phần header của trang web>-->
<div id="header_inner">…</div>
</div>
<div id="nav"><!--<địnhnghĩa vùng chứa navigator (điều hướng) của trang web>--
>
<div id="nav_inner">…</div>
</div>
<div id="content">
<div id=“content_inner“>…</div>
</div>
<div id="footer"><!--<địnhnghĩa vùng chân (footer) của trang web>-->
<div id="footer_inner“>…</div>
</div>
</div>
</body>
14. BỐ CỤC 2 CỘT LINH HOẠT
Không khai báo giá trị width
Sử dụng ràng buộc thiết lập giới hạn kích thước thay
đổi của thẻ:
max-width: thiết lập kích thước lớn nhất
min-width: thiết lập kích thước nhỏ nhất
Bài 5 - Bố cục trang cơ bản
Không khai báo giá trị width
Sử dụng ràng buộc thiết lập giới hạn kích thước thay
đổi của thẻ:
max-width: thiết lập kích thước lớn nhất
min-width: thiết lập kích thước nhỏ nhất
14
15. BỐ CỤC LINH HOẠT 2 CỘT
Bài 5 - Bố cục trang cơ bản 15
Nội dung co giãn
theo chiều rộng
17. BỐ CỤC 3 CỘT THƯỜNG
Bố cục ba cột có chiều rộng cố định làm việc giống
như phiên bản có hai cột.
Chia 100% chiều rộng cho ba cột theo tỷ lệ mong
muốn.
Bài 5 - Bố cục trang cơ bản 17
18. BỐ CỤC 3 CỘT THƯỜNG
Không khai báo giá trị width
Sử dụng ràng buộc:
max-width:…;
min-width:…;
<body>
<div id="main_wrapper"><!--<địnhnghĩa div chứa toàn bộ nội dung web>-->
<div id="header"><!--<địnhnghĩa phần header của trang web>-->
<div id="header_inner">…</div>
</div>
<div id="nav"><!--<địnhnghĩa vùng chứa navigator (điều hướng) của trang web>-->
<div id="nav_inner">…</div>
</div>
<div id="content">
<div id=“content_inner“>…</div>
</div>
<div id=“promo"> <!--<địnhnghĩa vùng quảng cáo của trang web>-->
<div id=“promo_inner“>…</div>
</div>
<div id="footer"><!--<địnhnghĩa vùng chân (footer) của trang web>-->
<div id="footer_inner“>…</div>
</div>
</div>
</body>
Bài 5 - Bố cục trang cơ bản
Không khai báo giá trị width
Sử dụng ràng buộc:
max-width:…;
min-width:…;
18
<body>
<div id="main_wrapper"><!--<địnhnghĩa div chứa toàn bộ nội dung web>-->
<div id="header"><!--<địnhnghĩa phần header của trang web>-->
<div id="header_inner">…</div>
</div>
<div id="nav"><!--<địnhnghĩa vùng chứa navigator (điều hướng) của trang web>-->
<div id="nav_inner">…</div>
</div>
<div id="content">
<div id=“content_inner“>…</div>
</div>
<div id=“promo"> <!--<địnhnghĩa vùng quảng cáo của trang web>-->
<div id=“promo_inner“>…</div>
</div>
<div id="footer"><!--<địnhnghĩa vùng chân (footer) của trang web>-->
<div id="footer_inner“>…</div>
</div>
</div>
</body>
19. BỐ CỤC 3 CỘT THƯỜNG
promo
Bài 5 - Bố cục trang cơ bản 19
21. BỐ CỤC 3 CỘT LINH HOẠT
Mọi thứ trở nên phức tạp hơn nếu ta muốn thêm
tính linh hoạt và căn giữa cho bố cục ba cột, trong
đó vùng nội dung thay đổi chiều rộng khi cửa sổ
trình duyệt thay đổi kích thước, nhưng các cột hai
bên vẫn giữ nguyên kích thước cũ
Chuyên gia CSS Ryan Brill nhanh chóng tìm ra câu
trả lời - sử dụng lề âm - và giải pháp của ông trở
thành giải pháp CSS cổ điển, hiện được dùng trong
vô số trang web có bố cục linh hoạt.
Bài 5 - Bố cục trang cơ bản 21
Mọi thứ trở nên phức tạp hơn nếu ta muốn thêm
tính linh hoạt và căn giữa cho bố cục ba cột, trong
đó vùng nội dung thay đổi chiều rộng khi cửa sổ
trình duyệt thay đổi kích thước, nhưng các cột hai
bên vẫn giữ nguyên kích thước cũ
Chuyên gia CSS Ryan Brill nhanh chóng tìm ra câu
trả lời - sử dụng lề âm - và giải pháp của ông trở
thành giải pháp CSS cổ điển, hiện được dùng trong
vô số trang web có bố cục linh hoạt.
22. BỐ CỤC 3 CỘT LINH HOẠT
Bài 5 - Bố cục trang cơ bản 22
23. CHIỀU NGANG CỦA TRANG
Điều khiển được chiều ngang của những bố cục này
là chìa khóa xử lý cách chúng hoạt động.
Người dùng rất ghét phải cuộn trang sang ngang
Bạn muốn tạo bố cục mở rộng theo chiều dọc để có
đủ không gian chứa nội dung mà không cần thay
đổi chiều ngang
Tổng kích thước chiều ngang của tất cả các box
trong trang web không nên vượt quá kích thước
chiều ngang của toàn trang
Điều khiển được chiều ngang của những bố cục này
là chìa khóa xử lý cách chúng hoạt động.
Người dùng rất ghét phải cuộn trang sang ngang
Bạn muốn tạo bố cục mở rộng theo chiều dọc để có
đủ không gian chứa nội dung mà không cần thay
đổi chiều ngang
Tổng kích thước chiều ngang của tất cả các box
trong trang web không nên vượt quá kích thước
chiều ngang của toàn trang
Bài 5 - Bố cục trang cơ bản 23
25. BỐ CỤC NỔI (FLOAT LAYOUT)
Dễ dàng trong việc căn chỉnh
Tránh được hiện tượng xô lệch cột
Sử dụng thẻ overflow để tránh hiện tượng xô lệch
các cột
Overflow: điều khiển cách tác động của thẻ lên nội
dung bên trong
Sử dụng kèm clear
Dễ dàng trong việc căn chỉnh
Tránh được hiện tượng xô lệch cột
Sử dụng thẻ overflow để tránh hiện tượng xô lệch
các cột
Overflow: điều khiển cách tác động của thẻ lên nội
dung bên trong
Sử dụng kèm clear
Bài 5 - Bố cục trang cơ bản 25
26. BỐ CỤC NỔI (FLOAT LAYOUT)
overflow
auto
hidden
inherit
Bài 5 - Bố cục trang cơ bản
overflow inherit
scroll
visible
26
27. BỐ CỤC NỔI (FLOAT LAYOUT)
#nav { width:22%; float:left; }
#content { width:78%; float:left; top:0px; }
#footer { clear:both; }
Bài 5 - Bố cục trang cơ bản 27
28. BỐ CỤC TUYỆT ĐỐI (ABSOLUTE LAYOUT)
Các cột được quy định vị trí chính xác trong mọi
trường hợp (web browser, độ phân giải …)
Các cột hoàn toàn độc lập, không tương tác với
nhau các cột phía dưới không được đẩy xuống
Khắc phục vấn đề này bằng Javascript
Bài 5 - Bố cục trang cơ bản 28
29. NGĂN TRÀN BỐ CỤC
Thuộc tính overflow của CSS điều khiển cách các thẻ
làm việc với nội dung bên trong chúng.
Giá trị:
visible: làm cho thẻ mở rộng để bao bọc nội dung
bên trong
hidden: cột sẽ giữ nguyên chiều rộng của nó và hiển
thị phần ảnh vừa trong nó - không thay đổi kích
thước.
Thuộc tính overflow của CSS điều khiển cách các thẻ
làm việc với nội dung bên trong chúng.
Giá trị:
visible: làm cho thẻ mở rộng để bao bọc nội dung
bên trong
hidden: cột sẽ giữ nguyên chiều rộng của nó và hiển
thị phần ảnh vừa trong nó - không thay đổi kích
thước.
Bài 5 - Bố cục trang cơ bản 29
31. CĂN CHỈNH LAYOUT
Không giống như layout xây dựng trên nền bảng
(table), layout xây dựng trên nền tảng div không
làm cho các cột có cùng độ dài.
Có thể sửa chiều cao của div, nhưng không nên
Chiều cao của div (cả trang web) phụ thuộc vào nội
dung được đưa ra
Chúng ta cần chỉnh để có ảo giác rằng tất cả các cột
có cùng chiều cao, bằng cách
Đặt kiểu cột Faux
Lập trình mở rộng div
Không giống như layout xây dựng trên nền bảng
(table), layout xây dựng trên nền tảng div không
làm cho các cột có cùng độ dài.
Có thể sửa chiều cao của div, nhưng không nên
Chiều cao của div (cả trang web) phụ thuộc vào nội
dung được đưa ra
Chúng ta cần chỉnh để có ảo giác rằng tất cả các cột
có cùng chiều cao, bằng cách
Đặt kiểu cột Faux
Lập trình mở rộng div
Bài 5 - Bố cục trang cơ bản 31
32. CỘT FAUX
Phương thức này liên quan tới việc thêm hình nền
cho thẻ div wrapper của trang
Lặp lại hình nền để lấp đầy không gian trống
Bài 5 - Bố cục trang cơ bản 32
34. LẬP TRÌNH MỞ RỘNG DIV
Sử dụng Javascript để xác định cột dài nhất và điều
chỉnh cho phù hợp với những cột khác
CSS sử dụng DOM để thiết lập thuộc tính thẻ.
JavaScript là một ngôn ngữ kịch bản mạnh mẽ cũng
có thể lấy (và thiết lập) tất cả thuộc tính của mọi
thẻ trong DOM (ví dụ như chiều cao của div) và
thực hiện mọi loại xử lý trên chúng
Sử dụng Javascript để xác định cột dài nhất và điều
chỉnh cho phù hợp với những cột khác
CSS sử dụng DOM để thiết lập thuộc tính thẻ.
JavaScript là một ngôn ngữ kịch bản mạnh mẽ cũng
có thể lấy (và thiết lập) tất cả thuộc tính của mọi
thẻ trong DOM (ví dụ như chiều cao của div) và
thực hiện mọi loại xử lý trên chúng
Bài 5 - Bố cục trang cơ bản 34
35. LẬP TRÌNH MỞ RỘNG DIV
<script type="text/javascript"> window.onload=function(){
Nifty("div#nav,div#content,div#promo","medium same-height");
Nifty("div#header,div#footer","medium");
AddCss ("../../lib/nifty_corners/css/niftyCorners.css");
} </script>
<script type="text/javascript"> window.onload=function(){
Nifty("div#nav,div#content,div#promo","medium same-height");
Nifty("div#header,div#footer","medium");
AddCss ("../../lib/nifty_corners/css/niftyCorners.css");
} </script>
Bài 5 - Bố cục trang cơ bản 35
36. TỔNG KẾT
Sử dụng loại bố cục layout tùy thuộc vào từng dự
án, khối lượng nội dung đưa ra của dự án
Sử dụng bố cục nổi có ưu điểm:
Dễ căn chỉnh
Hạn chế được hiện tượng xô lệch layout
Ngăn tràn bố cục bằng cách sử dụng thuộc tính
overflow
Không nên đặt chiều cao cho div trong CSS
Căn chỉnh chiều cao cột: thường sử dụng phương
pháp cột Faux
Sử dụng loại bố cục layout tùy thuộc vào từng dự
án, khối lượng nội dung đưa ra của dự án
Sử dụng bố cục nổi có ưu điểm:
Dễ căn chỉnh
Hạn chế được hiện tượng xô lệch layout
Ngăn tràn bố cục bằng cách sử dụng thuộc tính
overflow
Không nên đặt chiều cao cho div trong CSS
Căn chỉnh chiều cao cột: thường sử dụng phương
pháp cột Faux
Bài 5 - Bố cục trang cơ bản 36