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. Bên cạnh đó, với 2 tính chất ID và Class thì 100% những thẻ đều với 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 Anh chị vậy ấy. Chi tiết thế nào thì chúng ta cộng Nhận định 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à duy nhất, dùng để gắn cho 1 thẻ HTML nào đó. Trong một file HTML thì ID là độc nhất vô nhị, tức thị bạn chẳng thể đặt một ID cho 2 thẻ HTML.
Việc đặt tên ID nên tuân theo luật lệ sau:
- Tên đặt tiếng Anh và không dấu, ko mang khoảng trắng, không với ký tự đặc thù.
- Đặt tên mang ý nghĩa, giúp Nhìn vào ID là ta biết được thẻ đấy sở hữu 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ẽ tiêu dùng 1 thẻ div để bao loanh quanh đầy đủ 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, giả dụ bạn muốn dùng CSS để chỉnh cho thẻ này thì tiêu dùng cú pháp sau:
#chowebbackground:red;height: 300px
Note : Bạn để ý dấu # trước Name ID nhé , sở hữu ID luôn phải mang dấu # và đó là yêu cầu
2. Class trong HTML là gì?
giả dụ 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 dùng để thiết lập 1 lớp những đối tượng với chung một đặc điểm. Do đó, bạn sở hữu 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 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 như có 100 bài thì mình sẽ cần đến 100 blocks. Ví như chúng ta tiêu dùng ID để đặt cho 100 blocks đó thì rất khó. Vì 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:
.postbackground: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. Lúc nào sử dụng ID và khi nào sử dụng class?
Đây là thắc mắc mà gần như bạn đã hỏi mình. Để trả lời thì bạn phải xem lại 2 khái niệm mà mình đã bộc lộ ở 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ó nếu cấu trúc trang web chỉ còn đó một vị trí mà thôi, tức CSS không sở hữu tính kế thừa.
- Class thì khác, với thể gắn class cho nhiều thẻ HTML khác nhau. Vì thế, bạn nên dùng trong trường hợp muốn những thẻ HTML khác nhau sở hữu thể kế thừa CSS của nhau.
Qua bày này mình đã hướng dẫn xong cách dùng ID và class trong HTML. Đây là vấn đề khá quan yếu, nó là tiền đề để Cả nhà học các bài tiếp theo đấy nhé. Hãy xem thật kỹ, nếu có nghi vấn 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
Comments
Post a Comment