Dấu chấm có ý nghĩa gì trong CSS?

Question

Ai đó có thể giải thích sự khác biệt cho hai bộ chọn CSS này không?

.work-container . h3 { 
font-size: 14px; 
margin-top: 0px; 
font-weight: 600; 
height: 27px; 
} 

Dấu chấm bổ sung ở định nghĩa phía trên là gì?

.work-container h3 { 
font-size: 14px; 
margin-top: 0px; 
font-weight: 600; 
height: 27px; 
} 

Answer 1

Tiền tố . thường đại diện cho bộ chọn lớp, nhưng nếu nó được theo sau bởi khoảng trắng thì đó là lỗi cú pháp.

Nếu tôi có nguy cơ đoán, thì có thể tác giả muốn nói .work-container > h3, nhưng bỏ lỡ phím Shift ngay khi sắp nhập ký tự > (số child combinator).

Bộ chọn thứ hai của bạn, .work-container h3, chỉ đơn giản là bất kỳ h3 nào được chứa trong một phần tử có một lớp được gọi là work-container.

Answer 2

. nói lớp mình

# nghĩa của nó một id

và nếu không có gì nhưng bộ chọn, sau đó nó là một thẻ

Answer 3

. trong CSS có nghĩa là nó là một lớp học và nó có thể được áp dụng cho nhiều yếu tố.

# trong CSS có nghĩa là đó là ID và có thể áp dụng cho một phần tử trên mỗi trang.

Không có thẻ nào, đó là thẻ, nhắm mục tiêu tất cả mức sử dụng.

Trong cú pháp của bạn, .work-container . h3 thực sự là lỗi. Số . phải là , hoặc là BoltClock cho biết, >, cho biết toán tử con trực tiếp trong CSS.

Answer 4

. trong CSS có nghĩa là nó là một lớp & nó có thể được áp dụng cho nhiều yếu tố với không gian sử dụng giữa các lớp

Ví dụ:

<h3 class="class1 class2 class2">Heading</h3> 

# trong CSS có nghĩa là nó là một ID và nó có thể được áp dụng cho một phần tử trên mỗi trang.

Ví dụ

<h3 id="idname1">Heading</h3> 

Answer 5

Các trường hợp

• Selector bắt đầu với dấu chấm

  .class_name nghĩa tên lớp

• Hai doted selector ngăn cách bởi không gian

  .outside.inside

  nghĩa phần tử với .inside lớp hậu duệ của một phần tử với lớp .outside

• Hai selector doted mà không tách

  .name1.name2

  nghĩa yếu tố đó có cả lớp name1 và name2 ví dụ: class="name1 name2"

stackoverflow Link1

stackoverflow Link2