Tìm hiểu cú pháp và Selector trong CSS

Chỉ cần có một chút kiến thức và hiểu biết về CSS cũng hỗ trợ chúng ta rất nhiều trong công việc. Để bắt đầu, trong bài học CSS dưới đây bạn đọc cùng Taimienphi.vn tìm hiểu về cú pháp và Selector trong CSS nhé.

Trong bài viết dưới đây Taimienphi.vn sẽ giới thiệu cho bạn các cú pháp cơ bản và Selector trong CSS. Ngoài ra nếu mới làm quen với CSS, bạn đọc có thể tham khảo thêm một số bài học CSS đã có trên Taimienphi.vn để tìm hiểu thêm thông tin chi tiết nhé.

Tim hieu cu phap va Selector trong CSS

Tìm hiểu cú pháp và Selector trong CSS

1. Cú pháp CSS

CSS Style Rules bao gồm selector, thuộc tính (property) và giá trị (value) của nó. Trong đó selector trỏ đến phần phần tử HTML, nơi áp dụng CSS Style. Thuộc tính CSS được phân tách bằng dấu chấm phẩy.

tim hieu cu phap va selector trong css

Cú pháp CSS có dạng như dưới đây:

selector {

// thuoc tinh CSS

}

Ví dụ:

Dưới đây là ví dụ minh họa cú pháp CSS:

tim hieu cu phap va selector trong css 2

Kết quả đầu ra có dạng: Taimienphi.vn.

2. Selector trong CSS

CSS Selector được sử dụng để chọn các phần tử HTML (HTML element) dựa trên tên phần tử (element name), id, thuộc tính, ... . Selector có thể chọn đồng thời một hoặc nhiều phần tử khác nhau.

tim hieu cu phap va selector trong css 3

3. Element selector

Element selector trong CSS được sử dụng để chọn các phần tử HTML được yêu cầu tạo kiểu. Trong khai báo selector bao gồm tên của phần tử HTML và các thuộc tính CSS được áp dụng cho phần tử đó và được đặt trong dấu {}.

- Cú pháp Element selector:

Cú pháp Element selector có dạng như dưới đây:

ten phan tu {

// thuoc tinh CSS

}

- Ví dụ:

tim hieu cu phap va selector trong css 4

Kết quả đầu ra có dạng: Taimienphi.vn.

id selector

id selector được sử dụng để thiết lập kiểu cho id đã cho. Thuộc tính id là định danh duy nhất trong tài liệu HTML. id selector được sử dụng cùng ký tự #.

- Cú pháp id selector:

#id_name {

// thuoc tinh CSS

}

- Ví dụ:

tim hieu cu phap va selector trong css 5

Kết quả đầu ra có dạng: Taimienphi.vn.

4. Class selector

Class selector được sử dụng để chọn tất cả các phần tử trong thuộc tính lớp cụ thể. Để chọn các phần tử trong một lớp cụ thể, chúng ta sử dụng ký tự (.) cùng tên đầy đủ của một lớp (class name). Tên đầy đủ của lớp được sử dụng để thiết lập thuộc tính CSS cho lớp đã cho.

- Cú pháp Class selector:

.ten lop {

// thuoc tinh CSS

}

- Ví dụ:

Dưới đây là ví dụ về Class selector:

tim hieu cu phap va selector trong css 6

Kết quả đầu ra có dạng: Taimienphi.vn.

Bài viết trên đây bạn đọc đã cùng Taimienphi.vn tìm hiểu về cú pháp và Selector trong CSS. Ngoài ra nếu có bất kỳ thắc mắc hoặc câu hỏi nào cần giải đáp, bạn đọc có thể để lại ý kiến của mình trong phần bình luận bên dưới bài viết.

http://thuthuat.taimienphi.vn/tim-hieu-cu-phap-va-selector-trong-css-48840n.aspx
Trong các bài học CSS tiếp theo Taimienphi.vn sẽ giới thiệu tiếp cho bạn cách nhúng CSS vào HTML nhé.

Tác giả: Hoàng Bách     (4.0★- 3 đánh giá)  ĐG của bạn?

  

Bài viết liên quan

Thuộc tính Font trong CSS
Soạn bài Cuốn sổ tay trang 118 - 119 SGK Tiếng Việt 3
Cú pháp cơ bản của Java
Thiết lập VPN trên Windows 10
Từ khóa và cú pháp cơ bản trong Pascal
Từ khoá liên quan:

Tìm hiểu cú pháp và Selector trong CSS

, CSS, học CSS,

SOFT LIÊN QUAN
  • Sổ tay lập trình

    Tự học code trên máy tính

    Sổ tay lập trình là một cuốn sách điện tử hay giúp những ai đam mê lập trình có thể tìm hiểu và học tập lập trình một cách tốt nhất để phục vụ cho công việc mơ ước trong tương lai của mình.

Tin Mới

  • Thuộc tính định dạng bảng trong CSS

    Trong bài học CSS trước bạn đọc đã cùng Taimienphi.vn tìm hiểu về các thuộc tính link trong CSS. Trong bài học tiếp theo dưới đây Taimienphi.vn sẽ giới thiệu tiếp cho bạn về thuộc tính định dạng bảng (table) trong CSS

  • Cách nhúng, chèn CSS vào tài liệu HTML

    Trong bài học CSS trước bạn đọc đã cùng Taimienphi.vn tìm hiểu về cú pháp và Selector trong CSS, trong bài học tiếp theo dưới đây Taimienphi.vn sẽ giới thiệu tiếp cho bạn một số cách nhúng, chèn CSS vào tài liệu HTML nhé.

  • Học CSS cho người mới

    Có nhiều lý do vì sao chúng ta nên học CSS - ngôn ngữ được sử dụng để tạo kiểu, định dạng và hiển thị những thứ được tạo bởi HTML. Bạn đọc cùng tham khảo tiếp bài viết dưới đây của Taimienphi.vn để tìm hiểu thêm thông tin nhé.

  • Nhận Code Tiếu Ngạo VNG ở đâu?

    Cuối cùng thì game đấu tướng kiếm hiệp Tiếu Ngạo VNG chính thức ra mắt người chơi vào ngày 1 tháng 7 năm 2019, nhân dịp ngày ra mắt, NPH VNG đã gửi tặng đến game thủ nhiều phần quà và mã Code Tiếu Ngạo VNG, giúp người chơi trải nghiệm tốt hơn.


 Mùa hè tới rồi muốn so sánh giá tìm điều hòa giá rẻ nhất thị trường hãy dùng TopGia để so sanh gia có nhiều mẫu dieu hoa để so sanh sanh, xem dieu hoagiá rẻ để so sánh giá