You are on page 1of 4

Bài này Bil đề cập đến vấn đề CSS ở trong Mash.

Nó sẽ dễ dàng hơn đối với những người mới

đi vào lĩnh vực ngôn ngữ lập trình đơn giản HTML.

Sau khi đã hiểu được cơ bản về HTML ở trong CSS chúng ta sẽ dễ dàng làm chủ CSS để có thể

tạo theme hay chỉnh sửa theme cho blog theo ý của mình.

1. Cú pháp

Cú pháp của một CSS được tạo nên từ ba phần: Bộ chọn (seclector), Thuộc tính (property) và

Giá trị (value). Và được viết theo chuẩn sau:

Bộ chọn {Thuộc tính: Giá trị} - selector {property: value}

- Bộ chọn: thường là các phần tử hay thẻ HTML mà bạn muốn chỉ định như: body, header,

content, sidebar, footer, v.v..

- Thuộc tính và Giá trị: Thuộc tính là các tính chất mà bạn muốn chỉ định. Thuộc tính luôn kèm

theo giá trị và chúng ngăn cách nhau bởi dấu hai chấm “:”.

Ví dụ:

Body {font: Arial}

Một bộ chọn có thể mang nhiều thuộc tính, và mỗi thuộc tính ngăn cách nhau bởi một dấu chấm

phẩy “;”.
Ví dụ:

Body {

font: arial;

color: #D3D4D5;

background: #3EDF42;

Nếu Giá trị là một từ dài để chỉ ra một tên nào đó, bạn phải đặt chúng vào trong dấu ngoặc kép.

Ví dụ:

P {font-family: “sans serif”}

2. Nhóm các Bộ chọn lại với nhau

Bạn có thể nhóm các Bộ chọn có cùng Thuộc tính lại với nhau để cho cú pháp ngắn gọn. Các bộ

chọn được ngăn cách với nhau bởi dấu phảy “,”.

Ví dụ: Bạn nhóm các thành phần h1, h2, h3, h4 của Header có cùng màu Xanh và font chữ là

Tahoma lại với nhau

h1, h2, h3, h4 {

color: blue;
font: tahoma;

3. Lời chú thích trong CSS

Bạn có thể thêm lời chú thích cho đoạn mã của bạn, nó sẽ giúp bạn biết đoạn mã đó thực hiện

nhiệm vụ gì hoặc có tác dụng gì. Lời chú thích sẽ giúp bạn dễ dàng nhớ lại những gì mình đã

viết trước đây. Lời chú thích này sẽ không được các trình duyệt hiển thị.

Một lời chú thích bắt đầu bằng một dấu “/*” và kết thúc bằng một dấu “*/”. Bạn có thể đặt đoạn

chú thích vào bất cứ đâu bạn muốn.

Ví dụ:

/* Đây là Sidebar */

#sidebar {

with: 300px;

padding: 10px;

font: Tahoma, Verdana;

Hoặc

#sidebar {
/* Đây là Sidebar */

with: 300px;

padding: 10px;

font: Tahoma, Verdana;

Hoặc

#sidebar {

with: 300px; /* Độ rộng của Sidebar */

padding: 10px;

font: Tahoma, Verdana;

Sau khi đã hiểu cơ bản về ngôn ngữ lập trình HTML các bạn sẽ tham khảo các cách tạo một tổ
hợp các câu lệnh cho các module ở phần 2