Đang chuẩn bị liên kết để tải về tài liệu:
Cách viết giản lược trong CSS

Nếu bạn là người thực sự muốn tìm hiểu về CSS, thì bạn không thể không tìm hiểu cách viết giản lược(shorthand) trong CSS. Cách viết này thực sự mang lại những lợi ích và tiện lợi khi bạn sử dụng CSS. Trước khi đi vào phân tích những tiện lợi mà nó mang lại, tôi xin lấy một ví dụ đơn giản như sau. Giả sử rằng chúng ta muốn định dạng cho một thẻ có đường viền bao quanh thì chúng ta cần phải viết. border-width: 1px; border-style: solid; border-color: #CC0000; Thay vì phải viết như vậy. | Cách viêt giản lược trong CSS Nếu bạn là người thực sự muốn tìm hiểu về CSS thì bạn không thể không tìm hiểu cách viết giản lược shorthand trong CSS. Cách viết này thực sự mang lại những lợi ích và tiện lợi khi bạn sử dụng CSS. Trước khi đi vào phân tích những tiện lợi mà nó mang lại tôi xin lấy một ví dụ đơn giản như sau. Giả sử rằng chúng ta muốn định dạng cho một thẻ div có đường viền bao quanh thì chúng ta cần phải viết. border-width 1px border-style solid border-color CC0000 Thay vì phải viết như vậy chúng ta chỉ cần viết border 1px solid CC0000 Qua ví dụ đơn giản ở trên ta có thể thấy cách viết này mang lại cho chúng ta một số lợi ích sau. Thứ hai 1. Thứ nhất nó giúp chúng ta giảm thiểu được đáng kể thời gian phải viết mã CSS. 2. Thứ hai bạn cứ tưởng tượng rằng file CSS của bạn có tới vài ngìn dòng và dung lượng lên tới vài trăm Kb thì cách viết này còn giúp bạn giảm thiểu được đáng kể dung lượng của file CSS và giúp bạn dễ dàng theo dõi hơn khi số lượng dòng của trang được giảm xuống. Sau đây tôi xin đi vào chi tiết một số thuộc tính trong CSs mà chúng ta có thể dùng cách viết giản lược. 1. Thuộc tính Color Có rất nhiều cách để định nghĩa một màu trong CSS chúng ta có thể định nghĩa theo hệ số Hexa trong hệ màu RGB hoặc chúng ta có thể viết tên màu ví dụ white red. . Nhưng cách định nghĩa theo hệ số Hexa được sử dụng thông dụng nhất. Để định nghĩa theo hệ Hexa chúng ta sẽ đặt dấu ở trước sau đó đến các thông số màu ví dụ 003366 . Dãy các thông số màu được chia làm 3 phần tương ứng với ba màu Red Green Blue 00 Red 33 Green 66 Blue . Trong cách định nghĩa hệ số màu ta cũng có cách viết giản lược như sau 000000 có thể viết 000 hoặc 003366 có thể viết 036 2. Thuộc tính margin và padding. margin-top 10px margin-right 15px margin-bottom 20px margin-left 25px Được thay thế bằng margin 10px 15px 20px 25px top right bottom left Tương tự với thuộc tính padding padding-top 10px pading-right 15px padding-bottom 20px padding-left 25px padding 10px 15px 20px 25px top .