Computer >> Hướng Dẫn Máy Tính >  >> Lập Trình >> CSS

Sử dụng pseudo-element ::first-line trong CSS

Sử dụng pseudo-element này để thêm kiểu đặc biệt cho dòng đầu tiên của văn bản trong một bộ chọn. Ví dụ sau minh họa cách dùng ::first-line để thêm hiệu ứng cho dòng đầu tiên của các phần tử.

Ví dụ

<html>
<head>
  <style>
    p::first-line {
      text-decoration: underline;
    }
    p.noline::first-line {
      text-decoration: none;
    }
  </style>
</head>
<body>
  <p class="noline"> Dòng này không có gạch dưới vì thuộc class noline.</p>
  <p>Dòng đầu của đoạn này sẽ được gạch dưới theo quy tắc CSS. Các dòng còn lại bình thường. Ví dụ cho thấy cách dùng ::first-line để tạo hiệu ứng cho dòng đầu của bất kỳ phần tử HTML nào.</p>
</body>
</html>