01/10/2018, 11:10
Pseudo class :first-child trong css
Chào các bạn
mình mới lọ mọ qua mảng web, mới học được html cơ bản css cơ bản, và css mình còn 1 phần về lớp ảo trong css pseudo class
m học đến :first-child : chọn thành phần đầu tiên trong 1 tag
m liệt kê ra được các kiểu như sau, nhưng khi thử khi có 1 số kiểu k chạy như mong muốn
có cái nào sai k nhỉ, xincamon
div :first-child{
}
div b:first-child{
}
div:first-child :first-child{
}
div:first-child b:first-child{
}
div:first-child b{
}
#id :first-child{
}
#id b:first-child{
}
#id:first-child b{
}
#id:first-child b:first-child{
}
#id:first-child :first-child{
}
p#id :first-child{
}
p#id b:first-child{
}
p#id:first-child b{
}
p#id:first-child :first-child{
}
p#id:first-child b:first-child{
}
.class :first-child{
}
.class b:first-child{
}
.class:first-child :first-child{
}
.class:first-child b:first-child{
}
.class:first-child b{
}
u.class :first-child{
}
u.class:first-child :first-child{
}
u.class:first-child b:first-child{
}
u.class b:first-child{
}
u.class:first-child b{
}
Bài liên quan
help help help
Ít nhất của đưa lênh codepen.io hoặc đưa cái hình + nêu ra không chạy mong muống chổ nào mới giúp được chứ. Chứ đưa CSS không bố ai giúp được.
HTML?
cái này k cần code mà, nhìn vào định nghĩa pseudo-class ấy bạn, mình đang ý muốn hỏi cái nào định nghĩa sai, chứ k hỏi code chạy sai ở đâu
Mình chả thấy sai ở đâu cả
code đây bạn
html
css
ở cái lớp ảo này , chọn thành phần đầu tiên trong thẻ p đầu tiên nó k chạy
p:first-child :first-child cái này chọn đến tận 3 lớp đấy, p:first-child con của <p> rồi tiếp tục chọn con bênh trong lần nữa, mà trong đoạn HTML bạn không có đối tượng này
ô thê đoạn này
chọn tất cả các thẻ h1 trong thẻ s đầu tiền có phải không, :3 loạn loại kiêu gì
Chọn tất cả h1 trong thằng con (cưng) đầu tiên của s tag (chưa thấy tag này bao giờ)
tag này m xem trên w3school đó
À tag HTML 5 mới, :v sau này toàn dùng Css để tạo dấu gạch thôi
đây
nó cứ loạn loạn kiểu gì, đây bạn xem
html
css
đoạn này chọn các thẻ h1 trong thẻ s nhưng với đk là thẻ s đầu tiên
nhưng như trên file html mình để thẻ s trước div thì chạy còn đề sau thì lại chạy :V
Xin lỗi cái này mình sai, s:first-child có nghĩa là <s> phải là thằng con đầu tiên của lớp mẹ
cái này là chọn thành phần đầu tiên của thẻ p nhưng với đk là thẻ p đầu tiên,
trong file html m có
nó phải chọn được ra thẻ strike mới đúng, có nhiều kiểu trong số mình liệt kê k chạy như ý muốn hoặc chạy nhưng kiểu đặt nơi này thì chạy, nơi khác thì không
Học kỹ quá cũng ko tốt đâu bạn, cứ học lướt nhanh rồi làm dự án cụ thể đi
Thì đúng rồi, nó yêu cấu phải là “con đầu tiên của lớp mẹ” nên chỉ để ở đầu được thôi, để mình lấy ví dụ cái codepen cho
mình không theo web, m theo c/c++ và java, nhưng muốn có 1 cái blog cá nhân viết linh tinh, nên mới lọ mọ sang web, m k muốn dùng framework tạo web có sẵn, hay dùng pts sinh mã front-end tự động hay kéo thả sinh mã tự động, vì blog m định viết cũng đơn giản, k có hiệu ứng gì nhiểu, nên muốn tự học rồi code tay :v hơi thủ công, nhưng học được nhiều
nghĩa là cái nào mà là kiểu
:frist-child để trước
thì phải luôn để ở đầu
còn :first-child để sau thì có thể đề ở bất cứ vị trí nào hả bạn
thế h m có yêu cầu như sau
chọn ra các thẻ h1 trong thẻ b với điều kiền là thẻ b đầu tiền
và chọn ra các thẻ u trong thẻ i vơi điều kiện thẻ i đầu tiện
vậy là 2 yêu cầu này k thể làm cùng lúc vì thành phần :first-child để trước thì chỉ có 1 đứa được đứng đầu
https://codepen.io/tranlehaiquan/pen/RZBNgN
p:first-child -> p phải đặt đầu tiên trong thể mẹ
p :first-child -> chọn thằng con đầu tiên của p (vị trí p ko liên quang)
p:fist-child span -> chọn tất cã thẻ span nằm trong trường hợp 1