Các ' ” thẻ được sử dụng để hiển thị văn bản trên trang web được coi là một đoạn văn. Thẻ “
” đi kèm với khoảng trắng được xác định trước được thêm vào trước và sau đoạn văn. Văn bản bên trong thẻ “
” luôn hiển thị trên dòng tiếp theo và cũng bỏ qua khoảng trắng thừa. Các nhà phát triển có thể sử dụng thẻ p để tách nội dung thành các phần riêng biệt hoặc để sắp xếp thông tin một cách hợp lý.
Hướng dẫn này trình bày thẻ p HTML cùng với cách triển khai thực tế.
Thẻ p HTML là gì?
Các ' ” thẻ được sử dụng trong trang web để nâng cao cấu trúc của nội dung và làm cho văn bản nổi bật hơn. Nó giúp trong quá trình SEO cho trang web có thể cải thiện thứ hạng của trang web trong kết quả tìm kiếm.
cú pháp
Cú pháp cho “ ” được hiển thị dưới dạng:
< P > Linux P >
Trong dòng mã trên, “ ” là thẻ bắt đầu và “
” là thẻ đóng. Bắt buộc phải sử dụng thẻ đóng để tránh sự phức tạp và chồng chéo của các thành phần HTML.
Truy cập vào ví dụ dưới đây để hiểu cách “ ” thẻ hoạt động:
< thân hình >< P > Xin chào cộng đồng Linuxhint P >
thân hình >
Đầu ra của đoạn mã trên được hiển thị bên dưới:
Đầu ra ở trên hiển thị văn bản thuần túy được hiển thị trên màn hình bằng cách sử dụng “ ' nhãn.
Làm cách nào để áp dụng kiểu dáng CSS cho thẻ
?
Các ' ” thẻ chấp nhận các thuộc tính chung như “ lớp học ”, “ nhận dạng ' hoặc ' phong cách ”, v.v. có thể được sử dụng để tạo kiểu cho phần tử đã chọn bằng các thuộc tính CSS. Nhà phát triển có thể sử dụng một trong các thuộc tính toàn cầu để chỉ áp dụng các thuộc tính CSS trên các phần tử cụ thể. Và để áp dụng phong cách cho tất cả “ ” các thẻ được sử dụng trên trang web chọn trực tiếp HTML “ P ” bên trong tệp CSS hoặc “
Ví dụ 1: Áp dụng các thuộc tính CSS cho tất cả các phần tử “p”
Để đặt các kiểu giống nhau trên tất cả các phần tử
HTML, hãy truy cập đoạn mã bên dưới:
< phong cách >P {
màu nền: rừng xanh;
màu trắng;
}
phong cách >
< thân hình >
< P > Xin chào cộng đồng Linuxhint P >
< P > Xin chào cộng đồng Linuxhint P >
< P > Xin chào cộng đồng Linuxhint P >
< P > Xin chào cộng đồng Linuxhint P >
thân hình >
Trong đoạn mã trên, CSS “ màu nền ' Và ' màu sắc ” thuộc tính được áp dụng cho “ P ” bằng cách trực tiếp chọn “ P ” bộ chọn phần tử.
Sau khi thực thi đoạn mã trên, trang web trông như thế này:
Đầu ra ở trên cho thấy rằng kiểu dáng giống nhau đã được áp dụng cho tất cả “ P ” các yếu tố trên trang web.
Ví dụ 2: Áp dụng các thuộc tính CSS cho phần tử “p” duy nhất
Đối với việc áp dụng các phong cách để duy nhất “ P ”, các thuộc tính kiểu, id hoặc lớp có thể được sử dụng. Các thuộc tính chung này áp dụng các thuộc tính CSS cho “ P ” phần tử mà chúng được đính kèm.
Hãy để chúng tôi truy cập vào một mã:
< phong cách >P {
màu nền: rừng xanh;
màu trắng;
}
.using-class {
màu nền: darkcyan;
}
# sử dụng-id{
màu nền: nâu hồng;
}
phong cách >
< thân hình >
< P > Xin chào cộng đồng Linuxhint P >
< P phong cách = 'màu nền: đỏ' > Xin chào cộng đồng Linuxhint P >
< P lớp học = 'lớp sử dụng' > Xin chào cộng đồng Linuxhint P >
< P nhận dạng = 'sử dụng-id' > Xin chào cộng đồng Linuxhint P >
< P > Xin chào cộng đồng Linuxhint P >
thân hình >
Trong đoạn mã trên, thuộc tính màu nền cho “ P ” phần tử được đặt với các giá trị khác nhau khi được sử dụng với các thuộc tính chung.
Sau khi thực thi đoạn mã trên, trang web sẽ xuất hiện như sau:
Đầu ra ở trên cho thấy rằng “ P ” các phần tử hiện được tạo kiểu độc đáo với sự trợ giúp của các thuộc tính toàn cục.
Phần kết luận
Các ' ”
.