Phân biệt ID và Class trong css WordPress

Mỗi thẻ HTML đều mang các thuộc tính riêng và khác nhau. Bên cạnh đó, mang 2 tính chất ID và Class thì 100% các thẻ đều mang thể tiêu dùng. ID giống như mã số chứng minh của Các bạn, còn class giống như nam nữ của Cả nhà vậy ấy. Chi tiết thế nào thì chúng ta cộng Tìm hiểu ngay nhé

Phân biệt ID và Class trong css WordPress

Phân biệt ID và Class trong css WordPress

1. ID trong HTML là gì?

ID trong HTML là 1 chuỗi xác định và độc nhất vô nhị, sử dụng để gắn cho 1 thẻ HTML nào đấy. Trong 1 file HTML thì ID là độc nhất vô nhị, tức thị bạn không thể đặt 1 ID cho hai thẻ HTML.

Việc đặt tên ID nên tuân theo luật lệ sau:

• Tên đặt tiếng Anh và ko dấu, không có khoảng trắng, không mang ký tự đặc trưng.
• Đặt tên sở hữu ý nghĩa, giúp Nhìn vào ID là ta biết được thẻ đó với công dụng là gì.

Ví dụ: Mình tạo một hộp thoại hiển thị mã ưu đãi, và mình sẽ tiêu dùng một thẻ div để bao quành hồ hết hộp thoại ấy. Sau đấy mình cũng không quên đặt ID cho nó là “choweb“.

<div id=”choweb“>

Content

</div>

khi này, giả dụ bạn muốn sử dụng CSS để chỉnh cho thẻ này thì sử dụng cú pháp sau:

#choweb

background:red;

height: 300px

Note : Bạn quan tâm dấu # trước Name ID nhé , sở hữu ID luôn phải mang dấu # và ấy là đề xuất

2. Class trong HTML là gì?

nếu ID là duy nhất trong 1 file tài liệu HTML thì class thì lại khác, nó được sử dụng để thiết lập một lớp các đối tượng có chung 1 đặc điểm. Do vậy, bạn sở hữu thể gắn 1 class cho nhiều thẻ HTML khác nhau.

Việc đặt tên cho class cũng nên tuân thủ theo lệ luật mà mình đã chỉ dẫn trong phần một nhé.

2. Class trong HTML là gì?

Ví dụ: Mình muốn hiển thị danh sách bài viết, và mỗi bài viết mình sẽ gọi nó là một block. Như vậy, nếu có 100 bài thì mình sẽ cần tới 100 blocks. Giả dụ chúng ta tiêu dùng ID để đặt cho 100 blocks đấy thì rất khó. Bởi thế, ta sẽ đặt 1 class cho 100 blocks, và ta chỉ cần viết CSS cho class ấy là 100 block kia sẽ được ứng dụng CSS ngay.

<div class=”post”> Post một </div>

<div class=”post”> Post 2 </div>

<div class=”post”> Post 3 </div>

<div class=”post”> Post 4 </div>

Trong CSS mình sẽ viết như sau:

.post

background:red;

height: 100px;

margin: 20px;

như vậy, chúng ta dùng dấu . cho class và dấu # cho ID.

3. Lúc nào dùng ID và khi nào tiêu dùng class?

Đây là câu hỏi mà hồ hết bạn đã hỏi mình. Để giải đáp thì bạn phải xem lại 2 định nghĩa mà mình đã thể hiện ở trên.

• ID là duy nhất trong một tập tài liệu HTML. Vì thế, bạn nên đặt nó giả dụ cấu trúc trang web chỉ tồn tại 1 vị trí mà thôi, tức CSS ko sở hữu tính kế thừa.
• Class thì khác, có thể gắn class cho đa dạng thẻ HTML khác nhau. Do vậy, bạn nên tiêu dùng trong trường hợp muốn các thẻ HTML khác nhau mang thể kế thừa CSS của nhau.

Qua bày này mình đã chỉ dẫn xong cách dùng ID và class trong HTML. Đây là vấn đề khá quan yếu, nó là tiền đề để Anh chị em học những bài tiếp theo đấy nhé. Hãy xem thật kỹ, giả dụ mang thắc mắc gì thì hãy bình luận để mình trả lời.

Theo https://chowebs.com/phan-biet-id-va-class-trong-css-wordpress.html