search

Chúng ta có thể sử dụng nhiều lớp trong CSS không?

1 năms trước
Trả lời: 0
Lượt xem: 125

Để tránh lặp lại mã, chúng tôi sử dụng nhiều lớp trong HTML và CSS. Với CSS, chúng ta cũng có thể định nghĩa và định kiểu cả hai lớp cùng nhau và sử dụng nhiều lớp trong một phần tử bằng cách gán cho chúng các id lớp khác nhau. Cách tiếp cận này có thể được thực hiện bằng cách sử dụng cú pháp phân tách bằng dấu cách để thêm nhiều lớp vào một phần tử HTML

Show

Trong bài viết này, chúng ta sẽ tìm hiểu cách thêm nhiều lớp vào một phần tử

Làm cách nào để sử dụng nhiều lớp trong CSS?

Để sử dụng hai hoặc nhiều lớp trong một phần tử, id mỗi lớp sẽ được phân tách bằng dấu cách

Bạn phải tuân theo cú pháp sau để sử dụng nhiều lớp trong một phần tử

< h1 class = "class_1 class_2 class_3"> handing.. h >

 

Trong một phần tử HTML, bạn có thể bao gồm nhiều lớp bằng cách tách chúng bằng khoảng trắng. Để thuận tiện cho bạn, đây là một ví dụ

Thí dụ. Sử dụng nhiều lớp trong CSS

Trong ví dụ dưới đây, chúng ta sẽ tạo

  • A heading using the

    tag and assign the class name “heading”.

  • Tiếp theo, chúng ta sẽ tạo một tiêu đề khác và gán nó cho hai lớp khác nhau. “tiêu đề” và “dòng”. Các id lớp này được phân tách bằng dấu cách

< h1 lớp = "tiêu đề">
HTML
h1>h1>
< h1 class = "heading line"<>
Nhiều lớp trong Một phần tử
h1>h1>

 

Bây giờ, hãy chuyển sang tệp CSS và áp dụng một số thuộc tính CSS được liệt kê bên dưới

  • Đặt màu nền cho tiêu đề bằng hàm rgb() là “(69, 51, 151)”
  • Đặt kiểu chữ “nghiêng” cho tiêu đề

Trong lớp HTML, tiêu đề đầu tiên sử dụng tên lớp “tiêu đề”. Vì vậy, kiểu được chỉ định trong lớp đã chỉ định sẽ được triển khai trên tiêu đề đầu tiên

.heading {
màu nền. rgb (69 , 51, 151);
kiểu chữ. chữ nghiêng
}

 

Đối với lớp “dòng”, chúng ta có

  • Đặt màu của tiêu đề bằng hàm rgb() là “(255, 0, 0)”
  • Áp dụng text-decoration-line làm “gạch chân”

Tiêu đề thứ hai sẽ sử dụng phong cách của cả hai lớp. lớp “tiêu đề” và “dòng”

.line {
màu. rgb (255 , 0, 0);
văn bản-trang trí-dòng. gạch dưới;
}

 

Sau khi thực hiện, kiểm tra kết quả

Chúng ta có thể sử dụng nhiều lớp trong CSS không?

Từ đầu ra, bạn có thể quan sát thấy rằng tiêu đề thứ hai sử dụng cả hai lớp CSS

Phần kết luận

Để sử dụng nhiều lớp trên một phần tử, hãy sử dụng các id lớp khác nhau được phân tách bằng khoảng trắng. Sử dụng điều này, chúng ta có thể áp dụng các thuộc tính CSS khác nhau cùng một lúc. Nó cho phép chúng tôi sử dụng lại lớp nơi tồn tại các phần tử tương tự. Bài viết này giải thích cách sử dụng nhiều lớp trong một phần tử và tạo kiểu cho nó cùng với một ví dụ

Sử dụng nhiều bộ chọn lớp để áp dụng kiểu cho các thành phần là một cách tiếp cận mạnh mẽ. Có những trường hợp sử dụng thực tế khi sử dụng một bộ chọn duy nhất là không đủ hoặc thêm giá trị thấp hơn giá trị mà nó thêm vào. Trong bài viết này, chúng ta sẽ quan sát cách nhiều bộ chọn nâng cao mã kiểu của chúng ta trong một ví dụ thực tế

Lưu ý rằng bài viết này nói về việc sử dụng nhiều bộ chọn lớp chứ không phải bộ chọn tổ hợp. Một ví dụ về nhiều bộ chọn là .class1.class2 - nhắm mục tiêu một phần tử có cả hai lớp, lớp1 và lớp2. Mặt khác, .class1 > .class2 là một tổ hợp nhắm mục tiêu vào tất cả các con trực tiếp (không phải tất cả con cháu) của .class1 với .class2 được áp dụng.  

Giả sử bạn được giao nhiệm vụ xây dựng giao diện người dùng chia sẻ tệp. Nó cung cấp các tính năng cơ bản sau

  • Một danh sách các tập tin để chọn từ
  • Một danh sách những người nhận để lựa chọn từ

Cả tệp và người nhận đều được thể hiện dưới dạng lưới các biểu tượng. Khi một tệp/thành viên được chọn, biểu tượng của nó phải được tạo kiểu với một thiết kế cụ thể để thể hiện lựa chọn. Cả hai loại biểu tượng đều có giao diện khác nhau và bắt buộc phải có các kiểu lựa chọn khác nhau

Chúng ta có thể sử dụng một lớp. biểu tượng để tạo kiểu cho giao diện mặc định và một lớp khác .selected. Nhưng vấn đề là, các biểu tượng có các kiểu trạng thái mặc định và được chọn khác nhau. Nhiều bộ chọn lớp giải quyết vấn đề này một cách suôn sẻ. Chúng tôi có thể phân tách các kiểu theo quy tắc 

/* Multiple Selectors Demonstration */

span.file-icon:not(.selected):hover,
.file-icon:not(.selected):hover .page-turn {
  border-color: lightgreen;
}

.file-icon:not(.selected):hover .line {
  background-color: lightgreen;
}

span.file-icon.selected {
  background-color: lightgreen;
}

.avatar:not(.selected):hover {
  border-color: lightgreen;
}

.avatar.selected .head,
.avatar.selected .body {
  background-color: lightgreen;
}

/* UI styling */
* {
  font-family: sans-serif;
  margin: 0;
  padding: 0;
}

body {
  background-color: rgba(72, 171, 224, 0.15);
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}

.file-sharing-card {
  display: flex;
  justify-content: space-around;
  align-items: center;
  text-align: center;
  background-color: white;
  width: 80%;
  height: 80%;
  padding: 10px;
  border-radius: 15px;
  box-shadow: 0px 0px 15px 9px lightgray;
}

span.file-icon {
  position: relative;
  box-sizing: border-box;
  display: inline-block;
  height: 20vh;
  width: 16vh;
  margin: 5px;
  border: 2px solid black;
  border-radius: 5px;
  border-top-right-radius: 20px;
  cursor: pointer;
}

.file-icon .page-turn {
  display: inline-block;
  height: 35%;
  width: 30%;
  position: absolute;
  right: 0;
  border-left: 2px solid black;
  border-bottom: 2px solid black;
}

.content-lines {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: absolute;
  top: 50%;
  left: 25%;
  width: 50%;
  height: 30%;
}

.content-lines .line {
  height: 1px;
  background: black;
}

.avatar {
  display: inline-block;
  position: relative;
  display: inline-block;
  height: 20vh;
  width: 20vh;
  margin: 5px;
  border: 2px solid black;
  border-radius: 50%;
  cursor: pointer;
}

.avatar .head {
  display: inline-block;
  position: absolute;
  display: inline-block;
  height: 30%;
  width: 30%;
  border: 2px solid transparent;
  border-radius: 20px;
  top: 13%;
  left: 50%;
  transform: translateX(-50%);
  background: #48abe0;
}

.avatar .body {
  display: inline-block;
  position: absolute;
  height: 25%;
  width: 50%;
  border: 2px solid transparent;
  border-radius: 10vh 10vh 0 0;
  top: 53%;
  left: 50%;
  transform: translateX(-50%);
  background: #48abe0;
}
0 và 
/* Multiple Selectors Demonstration */

span.file-icon:not(.selected):hover,
.file-icon:not(.selected):hover .page-turn {
  border-color: lightgreen;
}

.file-icon:not(.selected):hover .line {
  background-color: lightgreen;
}

span.file-icon.selected {
  background-color: lightgreen;
}

.avatar:not(.selected):hover {
  border-color: lightgreen;
}

.avatar.selected .head,
.avatar.selected .body {
  background-color: lightgreen;
}

/* UI styling */
* {
  font-family: sans-serif;
  margin: 0;
  padding: 0;
}

body {
  background-color: rgba(72, 171, 224, 0.15);
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}

.file-sharing-card {
  display: flex;
  justify-content: space-around;
  align-items: center;
  text-align: center;
  background-color: white;
  width: 80%;
  height: 80%;
  padding: 10px;
  border-radius: 15px;
  box-shadow: 0px 0px 15px 9px lightgray;
}

span.file-icon {
  position: relative;
  box-sizing: border-box;
  display: inline-block;
  height: 20vh;
  width: 16vh;
  margin: 5px;
  border: 2px solid black;
  border-radius: 5px;
  border-top-right-radius: 20px;
  cursor: pointer;
}

.file-icon .page-turn {
  display: inline-block;
  height: 35%;
  width: 30%;
  position: absolute;
  right: 0;
  border-left: 2px solid black;
  border-bottom: 2px solid black;
}

.content-lines {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: absolute;
  top: 50%;
  left: 25%;
  width: 50%;
  height: 30%;
}

.content-lines .line {
  height: 1px;
  background: black;
}

.avatar {
  display: inline-block;
  position: relative;
  display: inline-block;
  height: 20vh;
  width: 20vh;
  margin: 5px;
  border: 2px solid black;
  border-radius: 50%;
  cursor: pointer;
}

.avatar .head {
  display: inline-block;
  position: absolute;
  display: inline-block;
  height: 30%;
  width: 30%;
  border: 2px solid transparent;
  border-radius: 20px;
  top: 13%;
  left: 50%;
  transform: translateX(-50%);
  background: #48abe0;
}

.avatar .body {
  display: inline-block;
  position: absolute;
  height: 25%;
  width: 50%;
  border: 2px solid transparent;
  border-radius: 10vh 10vh 0 0;
  top: 53%;
  left: 50%;
  transform: translateX(-50%);
  background: #48abe0;
}
1.  

Codepen sau minh họa giao diện người dùng và kiểu như vậy. Nhiều kiểu bộ chọn lớp đã được đặt ở đầu các kiểu để nhấn mạnh. Các chi tiết chung về việc triển khai giao diện người dùng này nằm ngoài phạm vi của bài viết này. Độc giả quan tâm có thể xem qua codepen để biết nó đã được xây dựng như thế nào.  

<div class="file-sharing-card">
  
  <div>
  <p>Select Files </p>
  <div>
    <span id="file1" class="file-icon" onclick="selectItem('file1')">
      <span class="page-turn"></span>
      <span class="content-lines">
        <span class="line"></span>
        <span class="line"></span>
        <span class="line"></span>
        <span class="line"></span>
        <span class="line"></span>
      </span>
    </span>
    <span id="file2" class="file-icon" onclick=selectItem('file2')>
      <span class="page-turn"></span>
      <span class="content-lines">
        <span class="line"></span>
        <span class="line"></span>
        <span class="line"></span>
        <span class="line"></span>
        <span class="line"></span>
      </span>
    </span>
    <span id="file3" class="file-icon" onclick=selectItem('file3')>
      <span class="page-turn"></span>
      <span class="content-lines">
        <span class="line"></span>
        <span class="line"></span>
        <span class="line"></span>
        <span class="line"></span>
        <span class="line"></span>
      </span>
    </span>
  </div>
  </div>

  <div>
  <p>Select Recipients</p>
  <div>
    <span id="person1" class="avatar" onclick=selectItem('person1')>
      <span class="head"></span>
      <span class="body"></span>
    </span>

    <span id="person2" class="avatar" onclick=selectItem('person2')>
      <span class="head"></span>
      <span class="body"></span>
    </span>

    <span id="person3" class="avatar" onclick=selectItem('person3')>
      <span class="head"></span>
      <span class="body"></span>
    </span>
  </div>
  </div>

</div>
/* Multiple Selectors Demonstration */

span.file-icon:not(.selected):hover,
.file-icon:not(.selected):hover .page-turn {
  border-color: lightgreen;
}

.file-icon:not(.selected):hover .line {
  background-color: lightgreen;
}

span.file-icon.selected {
  background-color: lightgreen;
}

.avatar:not(.selected):hover {
  border-color: lightgreen;
}

.avatar.selected .head,
.avatar.selected .body {
  background-color: lightgreen;
}

/* UI styling */
* {
  font-family: sans-serif;
  margin: 0;
  padding: 0;
}

body {
  background-color: rgba(72, 171, 224, 0.15);
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}

.file-sharing-card {
  display: flex;
  justify-content: space-around;
  align-items: center;
  text-align: center;
  background-color: white;
  width: 80%;
  height: 80%;
  padding: 10px;
  border-radius: 15px;
  box-shadow: 0px 0px 15px 9px lightgray;
}

span.file-icon {
  position: relative;
  box-sizing: border-box;
  display: inline-block;
  height: 20vh;
  width: 16vh;
  margin: 5px;
  border: 2px solid black;
  border-radius: 5px;
  border-top-right-radius: 20px;
  cursor: pointer;
}

.file-icon .page-turn {
  display: inline-block;
  height: 35%;
  width: 30%;
  position: absolute;
  right: 0;
  border-left: 2px solid black;
  border-bottom: 2px solid black;
}

.content-lines {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: absolute;
  top: 50%;
  left: 25%;
  width: 50%;
  height: 30%;
}

.content-lines .line {
  height: 1px;
  background: black;
}

.avatar {
  display: inline-block;
  position: relative;
  display: inline-block;
  height: 20vh;
  width: 20vh;
  margin: 5px;
  border: 2px solid black;
  border-radius: 50%;
  cursor: pointer;
}

.avatar .head {
  display: inline-block;
  position: absolute;
  display: inline-block;
  height: 30%;
  width: 30%;
  border: 2px solid transparent;
  border-radius: 20px;
  top: 13%;
  left: 50%;
  transform: translateX(-50%);
  background: #48abe0;
}

.avatar .body {
  display: inline-block;
  position: absolute;
  height: 25%;
  width: 50%;
  border: 2px solid transparent;
  border-radius: 10vh 10vh 0 0;
  top: 53%;
  left: 50%;
  transform: translateX(-50%);
  background: #48abe0;
}


function selectItem(event) {
  var classList = document.getElementById(event).classList;

  if (classList.contains("selected")) classList.remove("selected");
  else classList.add("selected");
}

Nhiều bộ chọn lớp CSS bổ sung thêm giá trị khi các trạng thái của các phần tử khác nhau có các kiểu được chia sẻ một phần. Thay vì lặp lại mã kiểu, chúng ta có thể chia sẻ mã kiểu trùng lặp và ghi đè mã kiểu duy nhất. Hãy chứng minh điều này bằng một ví dụ

Giả sử chúng ta đang xây dựng một tập hợp các thông báo có nội dung văn bản được đánh dấu giống như sau

Văn bản này chứa một thông báo Ngẫu nhiên quan trọng

Văn bản này chứa một thông báo Thành công quan trọng.

Văn bản này có văn bản Cảnh báo quan trọng.

Văn bản này có thông báo Lỗi quan trọng.

Yêu cầu của chúng tôi như sau

  • Văn bản được đánh dấu phải được in đậm và lớn
  • Văn bản bình thường sẽ được đánh dấu màu xanh lam. Các trạng thái Thành công, Cảnh báo, Lỗi sẽ có màu Xanh lục, Vàng/Vàng, Đỏ tương ứng

Chúng tôi nhanh chóng lưu ý rằng các văn bản quan trọng bình thường của chúng tôi có cỡ chữ lớn và màu xanh lam

.important {
  font-size: 1.5rem;
  color: blue;
}

Tiếp tục, chúng tôi nhận thấy rằng các văn bản thành công, cảnh báo và lỗi có cùng kích thước phông chữ mặc dù màu sắc khác nhau. Thay vì tạo một lớp riêng biệt là 

/* Multiple Selectors Demonstration */

span.file-icon:not(.selected):hover,
.file-icon:not(.selected):hover .page-turn {
  border-color: lightgreen;
}

.file-icon:not(.selected):hover .line {
  background-color: lightgreen;
}

span.file-icon.selected {
  background-color: lightgreen;
}

.avatar:not(.selected):hover {
  border-color: lightgreen;
}

.avatar.selected .head,
.avatar.selected .body {
  background-color: lightgreen;
}

/* UI styling */
* {
  font-family: sans-serif;
  margin: 0;
  padding: 0;
}

body {
  background-color: rgba(72, 171, 224, 0.15);
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}

.file-sharing-card {
  display: flex;
  justify-content: space-around;
  align-items: center;
  text-align: center;
  background-color: white;
  width: 80%;
  height: 80%;
  padding: 10px;
  border-radius: 15px;
  box-shadow: 0px 0px 15px 9px lightgray;
}

span.file-icon {
  position: relative;
  box-sizing: border-box;
  display: inline-block;
  height: 20vh;
  width: 16vh;
  margin: 5px;
  border: 2px solid black;
  border-radius: 5px;
  border-top-right-radius: 20px;
  cursor: pointer;
}

.file-icon .page-turn {
  display: inline-block;
  height: 35%;
  width: 30%;
  position: absolute;
  right: 0;
  border-left: 2px solid black;
  border-bottom: 2px solid black;
}

.content-lines {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: absolute;
  top: 50%;
  left: 25%;
  width: 50%;
  height: 30%;
}

.content-lines .line {
  height: 1px;
  background: black;
}

.avatar {
  display: inline-block;
  position: relative;
  display: inline-block;
  height: 20vh;
  width: 20vh;
  margin: 5px;
  border: 2px solid black;
  border-radius: 50%;
  cursor: pointer;
}

.avatar .head {
  display: inline-block;
  position: absolute;
  display: inline-block;
  height: 30%;
  width: 30%;
  border: 2px solid transparent;
  border-radius: 20px;
  top: 13%;
  left: 50%;
  transform: translateX(-50%);
  background: #48abe0;
}

.avatar .body {
  display: inline-block;
  position: absolute;
  height: 25%;
  width: 50%;
  border: 2px solid transparent;
  border-radius: 10vh 10vh 0 0;
  top: 53%;
  left: 50%;
  transform: translateX(-50%);
  background: #48abe0;
}
2 và lặp lại các kiểu bên cạnh màu duy nhất, chúng ta có thể chia sẻ các kiểu chồng chéo và ghi đè các kiểu duy nhất bằng cách sử dụng nhiều bộ chọn lớp

.important.success {
  color: green;
}

.important.warning {
  color: gold;
}

.important.error {
  color: red;
}

Đây là một ví dụ cơ bản với rất ít thuộc tính. Nhưng trong các cơ sở mã trong thế giới thực, giá trị bổ sung này có thể tiết kiệm một lượng lớn mã khỏi sự trùng lặp

Phần kết luận

CSS cung cấp phương pháp nhắm mục tiêu rất hiệu quả bằng cách sử dụng nhiều bộ chọn lớp. Cách tiếp cận này cho phép dễ dàng tách biệt các kiểu cho các thành phần khác nhau trong khi sử dụng lại tên của các lớp. Điều này đặc biệt hữu ích nếu tên mong muốn đại diện cho một trạng thái chung chung (chẳng hạn như .selected trong ví dụ trên) nhưng các yêu cầu về kiểu dáng lại khác. Nó thậm chí còn tăng thêm giá trị khi chúng ta cần chia sẻ một số kiểu trên nhiều phần tử

Chia sẻ trên Twitter · Chia sẻ trên Facebook

Chúng ta có thể sử dụng nhiều lớp trong CSS không?

UnusedCSS giúp chủ sở hữu trang web loại bỏ CSS không sử dụng của họ mỗi ngày. Đăng ký để xem bạn có thể loại bỏ bao nhiêu

Bạn có thể có bao nhiêu lớp trong CSS?

Không có giới hạn kỹ thuật (ngoại trừ dung lượng bộ nhớ mà trình duyệt có thể đang sử dụng), nhưng người ta nên cân nhắc kỹ lưỡng việc có nhiều lớp trên bất kỳ phần tử nào vì trình duyệt sẽ phải .

Bạn có thể có 2 lớp trong một div không?

Chắc chắn là các div có thể có nhiều hơn một lớp và với một số thành phần Bootstrap, bạn sẽ thường cần có nhiều lớp để chúng hoạt động như bạn muốn. Tất nhiên, cũng có thể áp dụng nhiều lớp bên ngoài bootstrap. Tất cả những gì bạn phải làm là tách từng lớp bằng một khoảng trắng.

Bạn có thể có nhiều lớp có cùng tên CSS không?

Nếu bạn có hai tệp CSS chứa cùng tên lớp thì thuộc tính của cả hai sẽ được áp dụng theo kiểu kết hợp . Nếu cả hai khai báo lớp chia sẻ cùng một thuộc tính, thì thuộc tính cho tệp được liên kết cuối cùng sẽ được áp dụng. Bất kỳ thuộc tính nào chỉ được khai báo trong một trong các tệp CSS sẽ được áp dụng.

Tôi có thể sử dụng nhiều lớp trong HTML không?

Các phần tử HTML có thể thuộc nhiều lớp . Để định nghĩa nhiều lớp, hãy phân tách các tên lớp bằng dấu cách, e. g.

programming css

Bài Viết Liên Quan

Đâu là nơi chính xác để chèn PHP?
Đâu là nơi chính xác để chèn PHP?

Làm thế nào để làm chủ trăn
Làm thế nào để làm chủ trăn

Cách lấy múi giờ trong PHP?
Cách lấy múi giờ trong PHP?

Python hoặc phát triển web reddit
Python hoặc phát triển web reddit

Chỉ định kiểu dữ liệu python
Chỉ định kiểu dữ liệu python

Lịch thi đấu bóng đá ngày 14 tháng 1 năm 2023
Lịch thi đấu bóng đá ngày 14 tháng 1 năm 2023

Xóa mục đầu tiên khỏi mảng PHP
Xóa mục đầu tiên khỏi mảng PHP

Nhịp tim bao nhiêu là vừa
Nhịp tim bao nhiêu là vừa

Ai nên đăng ký FUAS 2023?
Ai nên đăng ký FUAS 2023?

Không tìm thấy mô-đun không thể giải quyết chỉ mục css
Không tìm thấy mô-đun không thể giải quyết chỉ mục css

MỚI CẬP NHẬP

Nhiệt đọ trung bình năm cảu e-riats năm 2024
8 giâys trước . bởi ClearOwner
Phương tiện phát minh ra sau xe đạp là gì năm 2024
12 giâys trước . bởi Self-imposedTechnology
Tập làm văn tả người lao động trí óc năm 2024
50 phúts trước . bởi ViolentAbundance
Chữ in hoa tiếng anh là gì in proper năm 2024
50 phúts trước . bởi Old-lineCilantro
Giải bài tập lịch sử lớp 4 trang 10 năm 2024
51 phúts trước . bởi SorrowfulRapidity
Chủ thể và khách thể là gì năm 2024
52 phúts trước . bởi SinuousMouthpiece
Game sự tiến hóa của loài người dawn of man năm 2024
1 giờs trước . bởi EnchantedBaron
75 phạm văn đồng dương kinh.hai phòng năm 2024
1 giờs trước . bởi ScandalousEnvirons
Bài tập công ty raymar có lời giải năm 2024
1 giờs trước . bởi ExplosiveConcur
Camera ip với nguồn switch poe là gì năm 2024
2 giờs trước . bởi MeltedPragmatism

Xem Nhiều

File kẹp tài liệu đục lỗ tiếng anh là gì năm 2024
2 ngàys trước . bởi InsidiousReceptor
Lỗi khi mở folder màn hình view bị thu nhỏ năm 2024
3 ngàys trước . bởi RegimentalAdoption
Viết bài văn nghị luận về bảo vệ môi trường năm 2024
1 ngàys trước . bởi RaspingPatchwork
Công văn sở giáo dục đào tạo tỉnh quảng ngãi năm 2024
23 giờs trước . bởi DapperFoothold
Uống vitamin d vào lúc nào tốt nhất năm 2024
2 ngàys trước . bởi PrimordialHacker
Rách giời rơi xuống nghĩa là gì năm 2024
4 ngàys trước . bởi VastOrientation
Lỗi không gõ được tiếng việt trên amis năm 2024
18 giờs trước . bởi PonderousCivility
Bài 35 sách giáo khoa toán 8 tập 1 năm 2024
3 giờs trước . bởi TenuousScenery
Những bài toán lớp 1 giúp trẻ tư duy năm 2024
1 ngàys trước . bởi AnnoyedWomanhood
Bởi vì em hết yêu anh đạo từ bài nào năm 2024
5 ngàys trước . bởi ImprovisedTraveler

Chúng tôi

Điều khoản

Trợ giúp

Mạng xã hội

Bản quyền © 2024 Inc.