Khóa học tự chọnclass Khuyến nghị khóa học:

CSS .

Chọn器 .class Để chọn tất cả các loại phần tử có class đặc định, hãy viết một dấu chấm ( class Định nghĩa và cách sử dụng

CSS.) ký tự, sau đó là class thuộc tính. Để chọn phần tử có giá trị thuộc tính đặc định.

element.class Để chọn tất cả các loại phần tử có class đặc định, hãy viết một dấu chấm ( class thuộc tính. Chọn器 được sử dụng để chọn phần tử có giá trị thuộc tính đặc định.

chỉ để chọn phần tử có giá trị thuộc tính đặc định class một loại phần tử cụ thể, hãy viết tên phần tử, sau đó là dấu chấm (.) ký tự, sau đó là class giá trị thuộc tính (xem ví dụ 2 bên dưới)。

Lưu ý：Các phần tử HTML có thể tham chiếu nhiều class（Xem ví dụ 3 bên dưới）。

Mô hình

Ví dụ 1

Chọn và thiết lập phong cách cho tất cả các phần tử có class="intro":

.intro {
  background-color: yellow;
}

Thử ngay

Ví dụ 2

Chọn và thiết lập phong cách cho tất cả các phần tử <p> có class="intro":

p.intro {
  background-color: yellow;
}

Thử ngay

Ví dụ 3

.class Cách sử dụng khác nhau của chọn器：

/* Chọn tất cả các phần tử có class="center" */
.center {
  text-align: center;
}
/* Chọn tất cả các phần tử <p> có class="large" */
p.large {
  font-size: 200%;
}
/* Chọn tất cả các phần tử <p> có class chứa "fancy" và "beige" */
p.fancy.beige {
  font-family: 'Courier New', monospace;
  background-color: beige;
  border: 2px solid green;
}
/* Chọn tất cả các phần tử class="ex2" trong phần tử <p> có class="ex1" */
p.ex1 .ex2 {
  background-color: yellow;
}

Thử ngay

Ngữ pháp CSS

.class {
  các định nghĩa CSS;
}

Ngữ pháp CSS

element.class {
  các định nghĩa CSS;
}

Chi tiết kỹ thuật

Hỗ trợ trình duyệt