Lớp so với ID
Cascading Style Sheets (CSS) là ngôn ngữ mô tả giao diện và định dạng của tài liệu được viết bằng ngôn ngữ đánh dấu. CSS được sử dụng rộng rãi để định kiểu các trang web được viết bằng HTML. CSS cho phép chỉ định các bộ chọn kiểu riêng của bạn ngoài việc áp dụng các kiểu cho các phần tử HTML. Điều này được thực hiện bằng cách sử dụng ID và bộ chọn lớp. Khi chỉ định kiểu cho một thành phần duy nhất, bộ chọn ID được sử dụng. Khi chỉ định kiểu cho một nhóm phần tử, bộ chọn lớp được sử dụng.
Một lớp học là gì?
Trong CSS, Bộ chọn lớp có thể được sử dụng để áp dụng kiểu riêng của bạn cho một nhóm các phần tử. Bộ chọn lớp được sử dụng để áp dụng một kiểu cụ thể cho một tập hợp các phần tử có cùng lớp. Trong CSS, một bộ chọn lớp được xác định bởi một điểm dừng hoàn toàn (.). Sau đây là một ví dụ về bộ chọn lớp được định nghĩa trong CSS.
.lớp học của tôi
màu: xanh;
font-weight: in đậm;
HTML có thể tham chiếu đến lớp được định nghĩa trong CSS bằng cách sử dụng lớp thuộc tính như được hiển thị dưới đây.
Đây là định dạng của tôi
Đây là định dạng của tôi một lần nữa
Như đã trình bày ở trên, cùng một lớp có thể được sử dụng cho nhiều phần tử và một phần tử có thể sử dụng nhiều lớp. Khi nhiều lớp được sử dụng trong cùng một phần tử, các lớp được chèn vào thuộc tính lớp được giới hạn bởi một khoảng trắng như được hiển thị dưới đây.
Đây là định dạng của tôi bằng hai lớp
ID là gì?
Trong CSS, bộ chọn ID có thể được sử dụng để áp dụng kiểu riêng của bạn cho một phần tử duy nhất. Trong CSS, bộ chọn ID được xác định bằng hàm băm (#). Sau đây là một ví dụ về bộ chọn ID được xác định trong CSS.
#mã số của tôi
màu đỏ;
văn bản-align: đúng;
HTML có thể tham chiếu đến bộ chọn ID được xác định trong CSS bằng cách sử dụng id thuộc tính như được hiển thị dưới đây.
Đây là định dạng của tôi một bộ chọn ID
ID là duy nhất. Do đó, mỗi phần tử chỉ có thể có một ID duy nhất và mỗi trang chỉ có thể có một phần tử duy nhất với ID cụ thể đó. ID có một đặc tính quan trọng có thể được sử dụng với trình duyệt. Nếu URL trang chứa giá trị băm (ví dụ: http: //myweb.com#my_id), trình duyệt sẽ cố gắng tự động định vị phần tử bằng ID ID my myidid và cuộn trang web để hiển thị phần tử đó. Đây là một lý do tại sao trang nên có một yếu tố duy nhất với ID cụ thể đó, để trình duyệt có thể xác định vị trí của yếu tố đó.
Sự khác biệt giữa Class và ID là gì?
Mặc dù cả bộ chọn Lớp và bộ chọn ID có thể được sử dụng để áp dụng kiểu riêng của bạn cho các thành phần trong trang web, chúng có một số khác biệt quan trọng. Bộ chọn lớp có thể được sử dụng để áp dụng kiểu riêng của bạn cho một nhóm phần tử, trong khi bộ chọn ID được sử dụng để áp dụng kiểu cho một phần tử duy nhất. Khi sử dụng ID, mỗi phần tử chỉ có thể có một ID duy nhất và mỗi trang chỉ có thể có một phần tử duy nhất với ID cụ thể đó, nhưng Class có thể được sử dụng cho nhiều phần tử và một phần tử có thể sử dụng nhiều Lớp. Hơn nữa, ID có thể được sử dụng để cuộn trang tự động để hiển thị phần tử với ID đó, nhưng điều này là không thể với bộ chọn lớp.