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

Mỗi thẻ HTML đều sở hữu những thuộc tính riêng và khác nhau. Không những thế, có 2 tính chất ID và Class thì 100% các thẻ đều có thể 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 ấ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

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

ID trong HTML là một chuỗi xác định và độc nhất, dùng để gắn cho một thẻ HTML nào ấy. Trong 1 file HTML thì ID là độc nhất, nghĩa là bạn chẳng thể đặt 1 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à ko dấu, ko với khoảng trắng, không với ký tự đặc biệt.
Đặt tên với ý nghĩa, giúp Nhìn vào ID là ta biết được thẻ đấy 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ẽ dùng một thẻ div để bao quanh quéo phần lớn 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>

lúc này, nếu 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é , sở hữu ID luôn phải với dấu # và ấy là buộc phải

hai. Class trong HTML là gì?

nếu như ID là duy 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 sở hữu chung một đặc điểm. Do vậy, 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 đã hướng dẫn trong phần một nhé.

2. Class trong HTML là gì?

hai. 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, giả dụ mang 100 bài thì mình sẽ cần tới 100 blocks. Nếu như chúng ta sử dụng ID để đặt cho 100 blocks ấy thì rất khó. Vì vậy, 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 vận 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;

tương tự, 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à lúc nào sử dụng class?

Đây là câu hỏi mà hồ 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 đã diễn tả ở trên.

ID là độc nhất vô nhị trong một tập tài liệu HTML. Vì vậy, bạn nên đặt nó ví như cấu trúc trang web chỉ tồn tại một vị trí mà thôi, tức CSS ko với tính kế thừa.
Class thì khác, sở hữu thể gắn class cho đa dạng thẻ HTML khác nhau. Thành ra, bạn nên 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 đã hướng dẫn xong bí quyết 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ỹ, nếu mang câu hỏi gì thì hãy bình luận để mình giải đáp.

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

Header Ads

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