SlideShare a Scribd company logo
1 of 16
Download to read offline
Bài 13 : Addon firefox cần dùng và cách chỉnh sửa css template 
Giới thiệu các addon thông dụng và hướng dẫn cài đặt 
1. Addon measureit 
Dùng để đo kích thướt trên website cho ra kích thước dạng px
Khởi động firefox 
Mở cây thước đo lên
2. Add on Color Zilla 
Dùng để hút màu trên web đưa ra mã màu mà mình hút được 
Cài đặt tương tự trên phần 1 
kết quả
Ví dụ: Lấy mã màu trên google
Kết quả Ta được #E58a08 
Hoặc ta có thể sử dụng tool Color Cop củng có chức năng tương tự như trên
3. Addon web developer 
Web Developer là một add-on nhỏ gọn, nhưng sẽ bổ sung cho bạn một thanh công cụ nhiều tiện ích, tích hợp cùng trình duyệt, đặc biệt hữu dụng với các nhà phát triển và thiết kế web. Đáng chú ý có: * Trình biên tập HTML và chỉnh sửa/duyệt mã nguồn. * Biên tập CSS. …..
Cài đặt tương tự như trên phần 1 
Kết quả
4. Notepad ++ 
Dùng để xem và chỉnh sửa code 
Truy cập vào trang web http://notepad-plus-plus.org/ download về
Tải về 
Cài vô máy tính 
Kết quả
5. Addon fireBug 
Giúp ta có thể tìm kiếm những dòng code css dễ dàng 
Cài đặt tương tự như phần 1 
Dùng firebug kết hợp vớ các tool và addon giới thiệu bên trên để chỉnh sửa 1 template 
Click phải lên website cần tìm code css  chọn inspect Element with firebug
Kết quả
Ta vào đúng đường dẫn 
Dùng notepad ++ Tìm đến dòng 1687 chỉnh sửa màu lại 
Dùng công cụ color corp hoặc Add on Color Zillad ( phần trên) 
Để lấy mã màu thay thế
Kết quả

More Related Content

Viewers also liked

Contributor vision
Contributor visionContributor vision
Contributor visiongcet11cp
 
Focus on values
Focus on valuesFocus on values
Focus on valuesgcet11cp
 
The Contributor’s IdentityCpd1
 The  Contributor’s  IdentityCpd1 The  Contributor’s  IdentityCpd1
The Contributor’s IdentityCpd1gcet11cp
 
Who is Contributor?
Who is Contributor?Who is Contributor?
Who is Contributor?gcet11cp
 
The contributor’s vision of career
The contributor’s vision of careerThe contributor’s vision of career
The contributor’s vision of careergcet11cp
 
Design solution
Design solutionDesign solution
Design solutiongcet11cp
 
The scope of contribution
The scope of contributionThe scope of contribution
The scope of contributiongcet11cp
 
Embarking on the journey to contributorship
Embarking on the journey to contributorshipEmbarking on the journey to contributorship
Embarking on the journey to contributorshipgcet11cp
 

Viewers also liked (9)

Contributor vision
Contributor visionContributor vision
Contributor vision
 
Focus on values
Focus on valuesFocus on values
Focus on values
 
The Contributor’s IdentityCpd1
 The  Contributor’s  IdentityCpd1 The  Contributor’s  IdentityCpd1
The Contributor’s IdentityCpd1
 
Who is Contributor?
Who is Contributor?Who is Contributor?
Who is Contributor?
 
The contributor’s vision of career
The contributor’s vision of careerThe contributor’s vision of career
The contributor’s vision of career
 
Design solution
Design solutionDesign solution
Design solution
 
The scope of contribution
The scope of contributionThe scope of contribution
The scope of contribution
 
Embarking on the journey to contributorship
Embarking on the journey to contributorshipEmbarking on the journey to contributorship
Embarking on the journey to contributorship
 
Бизнес план кафе Блинная
Бизнес план кафе Блинная Бизнес план кафе Блинная
Бизнес план кафе Блинная
 

Similar to Bài 13 : Addon firefox cần dùng và cách chỉnh sửa css template

Hướng dẫn tạo Loader trong .NET - bản dịch
Hướng dẫn tạo Loader trong .NET - bản dịchHướng dẫn tạo Loader trong .NET - bản dịch
Hướng dẫn tạo Loader trong .NET - bản dịchLevis Nickaster
 
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...
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...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...
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
 
BAI TAP TRONG ILLUSTRATOR.docx
BAI TAP TRONG ILLUSTRATOR.docxBAI TAP TRONG ILLUSTRATOR.docx
BAI TAP TRONG ILLUSTRATOR.docxHuong Dao
 
De kt15 p_trac nghiem
De kt15 p_trac nghiemDe kt15 p_trac nghiem
De kt15 p_trac nghiemSunkute
 
Hướng dẫn cài đặt & sử dụng git, github
Hướng dẫn cài đặt & sử dụng git, githubHướng dẫn cài đặt & sử dụng git, github
Hướng dẫn cài đặt & sử dụng git, githubnukeviet
 
Chuong vb.net
Chuong vb.netChuong vb.net
Chuong vb.netkienbom
 
[Athena] Nguyễn Nhật Nguyên - Báo cáo thực tập
[Athena] Nguyễn Nhật Nguyên - Báo cáo thực tập[Athena] Nguyễn Nhật Nguyên - Báo cáo thực tập
[Athena] Nguyễn Nhật Nguyên - Báo cáo thực tậpnnn4194a
 
Reverse Engineering .NET - Advanced Patching, Playing with IL
Reverse Engineering .NET - Advanced Patching, Playing with ILReverse Engineering .NET - Advanced Patching, Playing with IL
Reverse Engineering .NET - Advanced Patching, Playing with ILLevis Nickaster
 
ASP.NET basic
ASP.NET basicASP.NET basic
ASP.NET basicmeocon21
 
Coreldrawx7.pdf
Coreldrawx7.pdfCoreldrawx7.pdf
Coreldrawx7.pdfsonphan73
 
Tai lieu hoc ms word 2013 tieng viet
Tai lieu hoc ms word 2013 tieng vietTai lieu hoc ms word 2013 tieng viet
Tai lieu hoc ms word 2013 tieng vietAnh Pham Duy
 
20 Tính năng hay khi sử dụng google docs
20 Tính năng hay khi sử dụng google docs20 Tính năng hay khi sử dụng google docs
20 Tính năng hay khi sử dụng google docsAnh Truong
 
Hướng dẫn sử dụng hỗ trợ Seo
Hướng dẫn sử dụng hỗ trợ SeoHướng dẫn sử dụng hỗ trợ Seo
Hướng dẫn sử dụng hỗ trợ SeoVinamax
 
Bài tập Lập trinh viên thiết bị di động
Bài tập Lập trinh viên thiết bị di độngBài tập Lập trinh viên thiết bị di động
Bài tập Lập trinh viên thiết bị di độngRobert Commando
 
Auto search trong phần mềm seo master
Auto search trong phần mềm seo masterAuto search trong phần mềm seo master
Auto search trong phần mềm seo masterLê Giang Đinh
 
Huong dan thiet ke website bang photoshop
Huong dan thiet ke website bang photoshopHuong dan thiet ke website bang photoshop
Huong dan thiet ke website bang photoshopNguyễn Hữu Dức
 
[Bachkhoa-Aptech] Hướng dẫn lập trình web doanh nghiệp
[Bachkhoa-Aptech] Hướng dẫn lập trình web doanh nghiệp[Bachkhoa-Aptech] Hướng dẫn lập trình web doanh nghiệp
[Bachkhoa-Aptech] Hướng dẫn lập trình web doanh nghiệpPhạm Văn Hưng
 
BÀI 2: Thiết kế FORM và xử lý sự kiện - Giáo trình FPT
BÀI 2: Thiết kế FORM và xử lý sự kiện - Giáo trình FPTBÀI 2: Thiết kế FORM và xử lý sự kiện - Giáo trình FPT
BÀI 2: Thiết kế FORM và xử lý sự kiện - Giáo trình FPTMasterCode.vn
 
Windows Presentation Foundation
Windows Presentation FoundationWindows Presentation Foundation
Windows Presentation Foundationquyloc
 

Similar to Bài 13 : Addon firefox cần dùng và cách chỉnh sửa css template (20)

Hướng dẫn tạo Loader trong .NET - bản dịch
Hướng dẫn tạo Loader trong .NET - bản dịchHướng dẫn tạo Loader trong .NET - bản dịch
Hướng dẫn tạo Loader trong .NET - bản dịch
 
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...
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...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...
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...
 
Slide5
Slide5Slide5
Slide5
 
BAI TAP TRONG ILLUSTRATOR.docx
BAI TAP TRONG ILLUSTRATOR.docxBAI TAP TRONG ILLUSTRATOR.docx
BAI TAP TRONG ILLUSTRATOR.docx
 
De kt15 p_trac nghiem
De kt15 p_trac nghiemDe kt15 p_trac nghiem
De kt15 p_trac nghiem
 
Hướng dẫn cài đặt & sử dụng git, github
Hướng dẫn cài đặt & sử dụng git, githubHướng dẫn cài đặt & sử dụng git, github
Hướng dẫn cài đặt & sử dụng git, github
 
Chuong vb.net
Chuong vb.netChuong vb.net
Chuong vb.net
 
[Athena] Nguyễn Nhật Nguyên - Báo cáo thực tập
[Athena] Nguyễn Nhật Nguyên - Báo cáo thực tập[Athena] Nguyễn Nhật Nguyên - Báo cáo thực tập
[Athena] Nguyễn Nhật Nguyên - Báo cáo thực tập
 
Reverse Engineering .NET - Advanced Patching, Playing with IL
Reverse Engineering .NET - Advanced Patching, Playing with ILReverse Engineering .NET - Advanced Patching, Playing with IL
Reverse Engineering .NET - Advanced Patching, Playing with IL
 
ASP.NET basic
ASP.NET basicASP.NET basic
ASP.NET basic
 
Coreldrawx7.pdf
Coreldrawx7.pdfCoreldrawx7.pdf
Coreldrawx7.pdf
 
Tai lieu hoc ms word 2013 tieng viet
Tai lieu hoc ms word 2013 tieng vietTai lieu hoc ms word 2013 tieng viet
Tai lieu hoc ms word 2013 tieng viet
 
20 Tính năng hay khi sử dụng google docs
20 Tính năng hay khi sử dụng google docs20 Tính năng hay khi sử dụng google docs
20 Tính năng hay khi sử dụng google docs
 
Hướng dẫn sử dụng hỗ trợ Seo
Hướng dẫn sử dụng hỗ trợ SeoHướng dẫn sử dụng hỗ trợ Seo
Hướng dẫn sử dụng hỗ trợ Seo
 
Bài tập Lập trinh viên thiết bị di động
Bài tập Lập trinh viên thiết bị di độngBài tập Lập trinh viên thiết bị di động
Bài tập Lập trinh viên thiết bị di động
 
Auto search trong phần mềm seo master
Auto search trong phần mềm seo masterAuto search trong phần mềm seo master
Auto search trong phần mềm seo master
 
Huong dan thiet ke website bang photoshop
Huong dan thiet ke website bang photoshopHuong dan thiet ke website bang photoshop
Huong dan thiet ke website bang photoshop
 
[Bachkhoa-Aptech] Hướng dẫn lập trình web doanh nghiệp
[Bachkhoa-Aptech] Hướng dẫn lập trình web doanh nghiệp[Bachkhoa-Aptech] Hướng dẫn lập trình web doanh nghiệp
[Bachkhoa-Aptech] Hướng dẫn lập trình web doanh nghiệp
 
BÀI 2: Thiết kế FORM và xử lý sự kiện - Giáo trình FPT
BÀI 2: Thiết kế FORM và xử lý sự kiện - Giáo trình FPTBÀI 2: Thiết kế FORM và xử lý sự kiện - Giáo trình FPT
BÀI 2: Thiết kế FORM và xử lý sự kiện - Giáo trình FPT
 
Windows Presentation Foundation
Windows Presentation FoundationWindows Presentation Foundation
Windows Presentation Foundation
 

Bài 13 : Addon firefox cần dùng và cách chỉnh sửa css template

  • 1. Bài 13 : Addon firefox cần dùng và cách chỉnh sửa css template Giới thiệu các addon thông dụng và hướng dẫn cài đặt 1. Addon measureit Dùng để đo kích thướt trên website cho ra kích thước dạng px
  • 2. Khởi động firefox Mở cây thước đo lên
  • 3.
  • 4.
  • 5. 2. Add on Color Zilla Dùng để hút màu trên web đưa ra mã màu mà mình hút được Cài đặt tương tự trên phần 1 kết quả
  • 6. Ví dụ: Lấy mã màu trên google
  • 7. Kết quả Ta được #E58a08 Hoặc ta có thể sử dụng tool Color Cop củng có chức năng tương tự như trên
  • 8. 3. Addon web developer Web Developer là một add-on nhỏ gọn, nhưng sẽ bổ sung cho bạn một thanh công cụ nhiều tiện ích, tích hợp cùng trình duyệt, đặc biệt hữu dụng với các nhà phát triển và thiết kế web. Đáng chú ý có: * Trình biên tập HTML và chỉnh sửa/duyệt mã nguồn. * Biên tập CSS. …..
  • 9. Cài đặt tương tự như trên phần 1 Kết quả
  • 10. 4. Notepad ++ Dùng để xem và chỉnh sửa code Truy cập vào trang web http://notepad-plus-plus.org/ download về
  • 11. Tải về Cài vô máy tính Kết quả
  • 12.
  • 13. 5. Addon fireBug Giúp ta có thể tìm kiếm những dòng code css dễ dàng Cài đặt tương tự như phần 1 Dùng firebug kết hợp vớ các tool và addon giới thiệu bên trên để chỉnh sửa 1 template Click phải lên website cần tìm code css  chọn inspect Element with firebug
  • 15. Ta vào đúng đường dẫn Dùng notepad ++ Tìm đến dòng 1687 chỉnh sửa màu lại Dùng công cụ color corp hoặc Add on Color Zillad ( phần trên) Để lấy mã màu thay thế