Sự khác biệt giữa việc bắt đầu một khối mã trong CSS là gì. [chấm] và bằng # [băm]?

Question

Vui lòng trả lời các câu hỏi sau cho hai mã ví dụ CSS được cung cấp ở cuối.

1. Sự khác nhau giữa hai mã là gì? Một là bắt đầu với dấu chấm và một với băm.
2. Tôi có thể gọi những kiểu này thành HTML như thế nào? Tôi có nên sử dụng class="searchwrapper" hoặc tôi có nên sử dụng id="searchwrapper" không? Và tại sao, sự khác biệt là gì?

Ví dụ 1: Bắt đầu với # [băm]

#searchwrapper { 
    /*some text goes here*/ 
} 

Ví dụ 2: Bắt đầu với [chấm]

.searchbox { 
    /*some text goes here*/ 
} 

Answer 1

Đây là bộ chọn CSS:.

• #foo là phần tử có id foo
• .foo nghĩa là tất cả phần tử với lớp foo

Xem http://www.w3.org/TR/CSS2/selector.html

ID là duy nhất, vì vậy bạn chỉ có thể có một phần tử với cùng một ID. Trong khi một lớp có thể giống nhau cho nhiều phần tử (và mọi phần tử có thể có nhiều lớp).

Answer 2

Sự khác biệt:

. xác định một lớp

# xác định một ID

Lớp Ví dụ:

.myElement {...} 

sẽ phù hợp

<div class="myElement"> 

ID Ví dụ:

#myElement {...} 

sẽ phù hợp

<div id="myElement"> 

lớp hoặc ID: Làm thế nào để chọn

Chỉ có một yếu tố có thể có một ID cụ thể, nhưng nhiều yếu tố có thể chia sẻ một lớp học cụ thể.

• Nếu bạn nhắm mục tiêu một phần tử cụ thể, hãy cung cấp cho ID thành phần đó và sử dụng # trong CSS của bạn.
• Nếu bạn nhắm mục tiêu nhiều yếu tố có liên quan, hãy cho chúng một lớp và sử dụng . trong CSS của bạn.

Answer 3

1. [chấm] là một chọn lớp, xem Id Selectors
2. # là một selector id, xem Class Selectors

Answer 4

"#" được sử dụng nếu bạn đã gán id để các yếu tố tài liệu và "." dấu chấm được sử dụng nếu bạn đã sử dụng lớp với phần tử tài liệu.

Id cho mỗi phần tử trên tài liệu là duy nhất, vì vậy nếu bạn sử dụng # có nghĩa là bạn chỉ muốn áp dụng cho phần tử đó.

Vị trí như thể bạn sử dụng "." dấu chấm, nó có nghĩa là bạn muốn áp dụng css cho các phần tử có attirbute lớp được đặt thành tên đó là sau dấu chấm trong css. như ".myClass" vì vậy myClass là tên lớp.

Bạn có thể giúp bạn có thể áp dụng cùng một css trên nhiều id bởi:

#id1,#id2{ 
//your css 
} 

Answer 5

Đây là bộ chọn CSS:

#foo nghĩa một phần tử với id thiết lập để foo, nó đề cập đến <div id="foo"> .foo nghĩa một phần tử có lớp foo, nó đề cập đến <div class="foo">

Plus: bạn có thể có nhiều thành phần với cùng một số class nhưng bạn không thể e nhiều hơn một với cùng một `d`. (Trên thực tế bạn có thể nhưng đó là BAD, và W3C sẽ trừng phạt bạn).

Answer 6

'.' là lớp chọn và nó có thể được áp dụng trên nhiều yếu tố trong đó có cùng lớp

'#' là id chọn và chỉ áp dụng trên đặc biệt một yếu tố Id