cascading style sheets

Tìm hiểu và áp dụng Font-face Trước tiên, chúng ta sẽ xem qua video này để có thể biết được lịch sử hình thành của font-face và các chuyển đổi một font chữ tiếng Việt. Lỗi font tiếng Việt Mình chắc chắn một điều rằng, rất nhiều bạn sẽ không thể nào dùng được hết toàn bộ các ký tự tiếng Việt...

Sử dụng CSS3 để tạo Tabs Ở trong tutorial này mình sẽ hướng dẫn các bạn làm Tab Nội Dung với CSS3. Trước đây mọi người vẫn hay làm bằng jquery, nhưng từ khi có sự ra đời của CSS3 thì công việc này được đơn giản đi rất nhiều. Đối với những bạn chưa biết gì về Jquery có lẻ tutorial này sẽ làm các...

Cách làm menu cố định khi scroll chuột Floating menu thực sự không phải là một thủ thuật gì mới và ghê gớm lắm đâu. Nó có từ rất lâu rồi và cách dùng nó cũng thực sự không quá khó. Trong bài viết này mình sẽ hướng dẫn các bạn tạo một floating menu cho website và áp dụng nó vào trong XenForo...

Tìm hiểu các vùng làm việc của CSS 1. Giới thiệu các vùng làm việc trong CSS Để làm việc với CSS, chúng ta có thể sử dụng một trong ba vùng làm việc như sau: Vùng làm việc nội tuyến Vùng làm việc bên trong Vùng làm việc bên ngoài 2. Vùng làm việc nội tuyến Vùng làm việc nội tuyến của CSS là...

Tìm hiểu các kỹ thuật quản lý CSS của website tốt hơn Học CSS để có thể tự thiết kế giao diện cho website không hề khó vì CSS vốn rất dễ học. Chỉ cần biết quy tắc cú pháp viết CSS, biết lập vùng chọn và chịu khó tham khảo các thuộc tính là có thể viết được ngon lành. Thế nhưng một cái khó...

Sử dụng SASS để triển khai OOCSS Kỹ thuật viết CSS theo kỹ thuật OOCSS (CSS hướng đối tượng) nhằm giúp hạn chế khả năng trùng lặp CSS, cũng như dễ bảo dưỡng nếu sau này có nhu cầu sửa lại. Thế nhưng bản thân mình lúc mới áp dụng OOCSS cũng cảm thấy có một khó khăn rất lớn đó là mình không thể...

Giới thiệu Brackets Editor cho Web Designer Sau một thời gian sử dụng công cụ code editor Brackets, mình đã chính thức tạm bỏ hẳn Sublime Text và Coda 2 để sang dùng Brackets vì các lợi ích vượt trội của nó trong việc thiết kế website, đặc biệt là công việc front-end development vốn làm việc...

Hướng dẫn cách dàn trang với CSS Flexbox Trong CSS, từ trước tới nay nếu chúng ta muốn dàn layout của trang thì sẽ sử dụng các thuộc tính float và kỹ thuật clear float để chia cột website như ý muốn. Hoặc muốn thuận tiện hơn thì sử dụng các CSS Grid Framework để tiết kiệm thời gian. Nhưng nói...

Hướng dẫn cách chia cột trong CSS tối ưu với Semantic.gs Thực tế dựa theo kinh nghiệm đã trải qua của mình, thì phần chia cột cho website trong CSS là bước mình thấy buồn nhạt nhất vì chúng ta phải làm đi làm lại một động tác với nhiều đoạn CSS na ná nhau. Chính vì lẽ đó, mình đã chuyển qua...

Tổng quan về 960 Grid – CSS Framework 960 Grid là một CSS Framework, mục đích của nó là giúp những người thiết kế web có thể tiết kiệm thời gian, công sức cho những công việc phải lặp đi lặp lại. Tuy đây là một framework rất phổ biến nhưng lại thiếu trầm trọng tài liệu hướng dẫn. Nếu đây là lần...

Tổng hợp 11 bộ sưu tập hiệu ứng CSS3 đẹp mắt cho website Với các tính năng hỗ trợ các hiệu ứng chuyển động trong CSS3, giờ đây bạn có thể tự tạo các hiệu ứng chuyển động vô cùng đẹp mắt và chuyên nghiệp mà không cần dùng tới sự trợ giúp của Javascript hay jQuery vì nó là nguyên nhân ảnh hưởng...

Hướng dẫn fix lỗi liên kết bị xuống hàng ở Google Chrome Cách đây vài ngày, Google Chrome cập nhật lên phiên bản mới nhất gây ra tình trạng website bị lỗi xuống hàng ở các liên kết gây ra cảm giác rất khó chịu và nhiều người lầm tưởng website của mình bị lỗi giao diện, ấy thế mà thật ra lỗi...

Tìm hiểu cách làm hiển thị Responsive cho website Bài này chỉ nói qua Responsive nên các kiến thức cơ bản mình sẽ không nói qua, do vậy bạn cần chuẩn bị kiến thức HTML và CSS căn bản để có thể hiểu được trọn vẹn. Responsive là gì? Responsive là một tính từ để chỉ một website có thể hiển...

Tìm hiểu Prepros để biên dịch SASS, LESS, HAML…chuyên nghiệp Prepros là một ứng dụng miễn phí (cũng có bản Pro) giúp chúng ta biên dịch các ngôn ngữ hỗ trợ viết CSS, HTML (hay còn gọi là Processor) để làm việc nhanh hơn. Nếu bạn đã từng biết qua LESS, SASS hay HAML thì đó là Processor, mình...

Tìm hiểu cách sử dụng SASS để viết CSS chuyên nghiệp Khi viết CSS theo cách bình thường, có thể bạn đã chán ngán nhiều thao tác lặp đi lặp lại rất nhạt nhẽo, và bạn mong muốn có một cái gì đó hỗ trợ bạn làm việc với CSS chuyên nghiệp hơn. Nếu như bạn muốn đưa kiến thức CSS của mình lên một tầm...

Tổng kết serie CSS cơ bản Với 25 bài trước trong serie CSS cơ bản, mình chắc chắn là bạn đã có một lượng kiến thức nhất định về CSS rồi phải không nè? Ít nhất là bạn đã hiểu được làm sao để chia cột website, làm thế nào mà phần tử này có thể đổi màu khi rê chuột vào, làm sao cái hộp này có thể...

Hướng dẫn cách thay đổi hình dạng với transform và transform-origin Ngoài thuộc tính transition của CSS3 giúp bạn tạo ra các hiệu ứng chuyển động của các phần tử trong website, thì nó còn một thuộc tính khác được sử dụng kèm với transition rất thường xuyên đó là thuộc tính transform có chức...

Tìm hiểu cách tạo chuyển động với transition Một trong các kỹ thuật phổ biến ở các website hiện đại là có các hiệu ứng chuyển động cho từng đối tượng rất đẹp mắt được làm hoàn toàn bằng CSS3, khi mà trước đây đa phần các hiệu ứng chuyển động phải cần có sự trợ giúp của Javascript. Trong CSS3 có...

Tìm hiểu CSS Framework và cách sử dụng Qua các bài hướng dẫn CSS, chắc bạn cũng đã biết việc viết CSS từ đầu tới cuối cho các thành phần trong website rất gian nan và khá tốn công sức để có được một giao diện như ý muốn. Trong đó, có rất nhiều bước mà bạn phải làm đi làm lại đến chán nản. Vậy...

Hướng dẫn cách tạo layout đơn giản Từ các kiến thức mà bạn đã biết được ở 21 phần trước trong serie CSS cơ bản, bạn có thể đã biết qua một số kỹ thuật cơ bản nhưng quan trọng nhất trong việc sử dụng CSS để thiết kế giao diện cho website. Vậy tại sao chúng ta lại không vận dụng tất cả để thực...