đoạn Tại sao đầu tiên không dùng kiểu này p:first-childTại sao đoạn đầu tiên không dùng kiểu này p: con đầu lòng?
#content p:first-child {color:#4C4C4C;
font-size:1.2em;
font-weight:bold;
line-height:1.8;
margin-bottom:0.5em;}
<div id="content">
<h1>Welcome</h1>
<p>first paragraph</p>
<p>second paragraph</p>
<p>third paragraph</p>
</div>
Làm thế nào để chọn đoạn đầu tiên từ css?
Trong khi câu trả lời trước đã xác định vấn đề (mà p không phải là đứa con đầu lòng của phụ huynh div), đây là một giải pháp cho vấn đề của bạn, để nhắm mục tiêu các p đầu tiên mà sau một h1, tùy thuộc vào trình duyệt của bạn :
h1 + p { /* styles any paragraph that immediately follows a h1 element */ }
Điểm rất tốt. Nếu anh ta may mắn thì sẽ làm việc cho anh ta trên bảng. +1 –
Vâng, đây có vẻ là phương pháp tinh khiết nhất-css; mặc dù rõ ràng là áp dụng một lớp '.first' (hoặc bất kỳ thứ gì) vào đoạn đầu tiên sẽ tương thích với nhiều trình duyệt hơn. Khả năng tương thích có vẻ ổn (đối với hầu hết tất cả trừ IE6, với một số vấn đề đối với IE7 và IE8 * là * IE7): http://quirksmode.org/css/contents.html –
Bộ chọn khớp với bất kỳ phần tử p nào là con đầu tiên của phần tử gốc.
Trong trường hợp này, p là con thứ hai của cha mẹ.
Có một cái nhìn tại địa chỉ: http://www.w3schools.com/CSS/css_pseudo_classes.asp
nội dung của P không phải là đứa con đầu lòng của mình - từ những gì tôi đã nhìn thấy một thẻ như hoặc sẽ là đứa con đầu lòng không phải là nội dung thực tế.
Bạn đang tìm kiếm bộ chọn psuedo :first-of-type! Vì vậy, bạn sẽ thực hiện việc này để nhận được đoạn đầu tiên đó:
#content p:first-of-type
Luôn có thể chỉ định một lớp cho mọi đoạn chứng minh đầy đủ đầu tiên.
p.indent{
text-indent:50px;
}
Nguyên nhân IE không thích các phần tử giả – Luis