Mỗi thẻ HTML đều mang những thuộc tính riêng và khác nhau. Tuy nhiên, với hai thuộc tính ID và Class thì 100% các thẻ đều có thể tiêu dùng. ID giống như mã số chứng minh của Cả nhà, còn class giống như giới tính của Các bạn vậy ấ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
1. ID trong HTML là gì?
ID trong HTML là một chuỗi xác định và duy nhất, tiêu dùng để gắn cho 1 thẻ HTML nào ấy. Trong một file HTML thì ID là độc nhất vô nhị, nghĩa là bạn chẳng thể đặt 1 ID cho hai thẻ HTML.
Việc đặt tên ID nên tuân theo quy tắc sau:
- Tên đặt tiếng Anh và không dấu, ko có khoảng trắng, ko có ký tự đặc trưng.
- Đặt tên mang ý nghĩa, giúp Quan sát ID là ta biết được thẻ đó có 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ẽ tiêu dùng một thẻ div để bao quanh đa số hộp thoại ấy. Sau ấy 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:
#chowebbackground:red;height: 300px
Note : Bạn để ý dấu # trước Name ID nhé , có ID luôn phải với dấu # và đấy là bắt buộc
2. Class trong HTML là gì?
nếu như ID là độc nhất vô nhị trong 1 file tài liệu HTML thì class thì lại khác, nó được dùng để thiết lập một lớp những đối tượng mang chung 1 đặc điểm. Do đó, bạn có thể gắn một class cho nhiều thẻ HTML khác nhau.
Việc đặt tên cho class cũng nên tuân thủ theo luật lệ 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à 1 block. Như vậy, giả dụ có 100 bài thì mình sẽ cần tới 100 blocks. Nếu chúng ta tiêu dùng ID để đặt cho 100 blocks đó 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 đó là 100 block kia sẽ được áp dụng CSS ngay.
<div class=”post”> Post 1 </div>
<div class=”post”> Post hai </div>
<div class=”post”> Post 3 </div>
<div class=”post”> Post 4 </div>
Trong CSS mình sẽ viết như sau:
.postbackground: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 sử dụng ID và khi nào sử dụng class?
Đây là câu hỏi mà đầy đủ bạn đã hỏi mình. Để giải đáp thì bạn phải xem lại hai khái niệm mà mình đã biểu đạt ở trên.
- ID là độc nhất vô nhị trong 1 tập tài liệu HTML. Vì thế, bạn nên đặt nó ví như cấu trúc trang web chỉ còn đó một vị trí mà thôi, tức CSS ko sở hữu 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. Thành ra, bạn nên sử dụng trong trường hợp muốn các thẻ HTML khác nhau với thể kế thừa CSS của nhau.
Qua bày này mình đã chỉ dẫn xong phương pháp sử dụng ID và class trong HTML. Đây là vấn đề hơi quan yếu, nó là tiền đề để Cả nhà học các bài tiếp theo đó nhé. Hãy xem thật kỹ, nếu với thắc mắc gì thì hãy bình luận để mình tư vấn.
Theo https://chowebs.com/phan-biet-id-va-class-trong-css-wordpress.html