Tạo tài khoản

Hỏi về vùng chọn ccs cơ bản

vuontinh bắt đầu chủ đề từ 3 năm trước

@Phúc ·

em mới học về css cơ bản, mà đến phần vùng chọn em rối quá. có ví dụ như thế này em muốn cho màu chỉ

<p>Đây là thành phần p1 nằm bên trong thành phần div</p>
<p>Đây là thành phần p2 nằm bên trong thành phần div</p>

còn thẻ div con trong không cho màu. code html

<div>
<p>Đây là thành phần p1 nằm bên trong thành phần div</p>
<p>Đây là thành phần p2 nằm bên trong thành phần div</p>
<div>
<p>Đây là thành phần p1 con nằm bên trong thành phần div cha</p>
<p>Đây là thành phần p2 con nằm bên trong thành phần div cha</p>
</div>

</div>

code css em làm như thế này

div>p {
color: #ff0000;
}

em làm thế thì không chọn được mà nó chọn hết 2 thẻ div luôn, vậy làm thế nào để chọn được thẻ div đầu ạ

Html
CSS

Preview

Viết câu trả lời

1 Bình luận

nhiepphong

15/08/2020 21:35

Chào bạn

Bạn thêm class vào các thuộc tính html muốn css sau đó viết css theo class đó ví dụ:

html

<div>
     <p class="p1">Đây là thành phần p1 nằm bên trong thành phần div</p>
     <p class="p2">Đây là thành phần p2 nằm bên trong thành phần div</p>
     <div>
          <p class="p1">Đây là thành phần p1 con nằm bên trong thành phần div cha</p>
          <p class="p2">Đây là thành phần p2 con nằm bên trong thành phần div cha</p>
     </div>
</div>

viết css như sau:

div .p1 {
     color: #ff0000;
}
div .p2 {
     color: #ff0000;
}

Bạn đọc thêm bài viết này để hiểu dõ hơn về các thuộc tính html:

https://hoclaptrinh.vn/tutorial/hoc-html/cac-thuoc-tinh-trong-html

Và theo dõi serial học html và học css này để tìm hiểu từ các bước cơ bản nhé

Chúc bạn thành công !!

vuontinh

15/08/2020 22:09

@nhiepphong : vì mình đang thắc mắc về chọn thứ cấp liền nhau ấy bạn, mình chọn theo thứ cấp liền nhau thì nó không đc

nhiepphong

15/08/2020 22:50

@vuontinh : Như đoạn mã html bạn gửi thì là 2 thẻ div khác nhau 1 thẻ div bao thẻ div còn lại. Về cơ bản thì liền nhau hay thứ cấp ko quan trọng bạn cần css vùng nào cứ đặt class riêng vùng đó và css theo class đó thôi !

phqghume

19/06/2022 20:00

@nhiepphong :e@nhiepphong :

bắt đầu chủ đề từ ·

@ ·