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

Mỗi thẻ HTML đều có các thuộc tính riêng và khác nhau. Không những thế, mang hai thuộc tính ID và Class thì 100% các thẻ đều sở hữu 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ác bạn vậy đó. Chi tiết thế nào thì chúng ta cùng Phân tích ngay nhé

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

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

một. ID trong HTML là gì?

ID trong HTML là 1 chuỗi xác định và độc nhất vô nhị, dùng để gắn cho một thẻ HTML nào ấy. Trong 1 file HTML thì ID là độc nhất vô nhị, tức thị bạn chẳng thể đặt một 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 mang khoảng trắng, không sở hữu ký tự đặc biệt.
• Đặt tên với ý nghĩa, giúp Quan sát 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ã khuyến mãi, và mình sẽ dùng một thẻ div để bao nói quanh nói quẩn rất nhiều 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 để ý dấu # trước Name ID nhé , sở hữu ID luôn phải với dấu # và đó là đề nghị

hai. Class trong HTML là gì?

ví như ID là độc nhất vô nhị trong một file tài liệu HTML thì class thì lại khác, nó được tiêu dùng để thiết lập 1 lớp các đối tượng với chung một đặc điểm. Do vậy, bạn với thể gắn một class cho phổ thông 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 1 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. Tương tự, ví như có 100 bài thì mình sẽ cần đến 100 blocks. Ví như chúng ta dùng ID để đặt cho 100 blocks ấy thì rất khó. Do đó, ta sẽ đặt một class cho 100 blocks, và ta chỉ cần viết CSS cho class đó là 100 block kia sẽ được ứng dụng CSS ngay.

<div class=”post”> Post 1 </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 tiêu dùng dấu . cho class và dấu # cho ID.

3. Khi nào tiêu dùng ID và khi nào sử dụng class?

Đây là nghi vấn mà hầu hết bạn đã hỏi mình. Để tư vấn thì bạn phải xem lại 2 định nghĩa mà mình đã thể hiện ở trên.

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

Qua bày này mình đã chỉ dẫn xong cách sử dụng ID và class trong HTML. Đây là vấn đề hơi quan yếu, nó là tiền đề để Anh chị em học các bài tiếp theo ấy nhé. Hãy xem thật kỹ, ví như mang nghi vấn 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