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. Ngoài ra, mang 2 thuộc tính ID và Class thì 100% những thẻ đều sở hữu thể sử dụng. ID giống như mã số chứng minh của Cả nhà, 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

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ị, dùng để gắn cho 1 thẻ HTML nào đấy. Trong một file HTML thì ID là độc nhất vô nhị, tức thị bạn không thể đặt 1 ID cho 2 thẻ HTML.

Việc đặt tên ID nên tuân theo quy tắc sau:

  • Tên đặt tiếng Anh và ko dấu, ko mang 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ẻ đấy với công dụng là gì.

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

<div id=”choweb“>

Content

</div>

khi này, ví như bạn muốn dùng CSS để chỉnh cho thẻ này thì dùng cú pháp sau:

#choweb
background:red;
height: 300px

Note : Bạn để ý dấu # trước Name ID nhé , có ID luôn phải có dấu # và ấy là bắt buộc

2. Class trong HTML là gì?

nếu ID là độc nhất 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 những đối tượng có chung một đặc điểm. Vì vậy, bạn sở hữu thể gắn 1 class cho rộng rãi 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 đã hướng dẫn trong phần một nhé.

2. Class trong HTML là gì?

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ự, giả dụ sở hữu 100 bài thì mình sẽ cần tới 100 blocks. Nếu như chúng ta dùng ID để đặt cho 100 blocks ấy thì rất khó. Bởi vậy, ta sẽ đặt 1 class cho 100 blocks, và ta chỉ cần viết CSS cho class đó là 100 block kia sẽ được vận 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;

tương tự, chúng ta dùng dấu . cho class và dấu # cho ID.

3. Lúc nào dùng ID và lúc nào sử dụng class?

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

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

Qua bày này mình đã hướng dẫn xong phương pháp tiêu dùng ID và class trong HTML. Đây là vấn đề khá 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ỹ, nếu sở hữu 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

Comments

Popular posts from this blog

Sổ hồng và sổ đỏ khác nhau thế nào?

Mục tiêu chọn bảng điện dân dụng sử dụng trong gia đình an toàn

Phương pháp đổi tên theme wordpress trong phpmyadmin